/* /theme-light.css Light theme overrides, applied only when is present. No JS changes required. Safe across all your pages. */ /* ===== Base ===== */ body.lp { background:#ffffff; color:#0f172a; } body.lp a { color:#0b4cbf; } body.lp .muted { color:#64748b; } /* Header */ body.lp .sitebar{ background: rgba(255,255,255,.85); border-bottom: 1px solid #e5e7eb; backdrop-filter: saturate(1.1) blur(8px); } body.lp .nav a.link{ color:#334155; } body.lp .nav .pill{ background:#f8fafc; border-color:#e5e7eb; color:#334155; } body.lp .nav .btn{ background:#ffffff; border-color:#e5e7eb; color:#0f172a; } /* Footer */ body.lp .sitefoot{ background:#f8fafc; border-top:1px solid #e5e7eb; color:#64748b; } body.lp .badge{ background:#ffffff; border:1px solid #e5e7eb; color:#334155; } /* Cards & panels */ body.lp .card{ background:#ffffff; border:1px solid #e5e7eb; border-radius:16px; box-shadow: 0 12px 30px rgba(15,23,42,.06); } body.lp .panel{ background:#ffffff; border:1px solid #e5e7eb; border-radius:16px; box-shadow: 0 18px 50px rgba(15,23,42,.15); } /* Inputs */ body.lp input, body.lp select, body.lp textarea{ background:#ffffff; border:1px solid #e5e7eb; color:#0f172a; } body.lp input::placeholder, body.lp textarea::placeholder{ color:#94a3b8; } body.lp input:focus, body.lp select:focus, body.lp textarea:focus{ outline: none; border-color:#c3d3ff; box-shadow: 0 0 0 3px rgba(37,99,235,.15); } body.lp label{ color:#64748b; } /* Buttons (reuses your brand colors) */ body.lp .btn{ background:#ffffff; border:1px solid #e5e7eb; color:#0f172a; } body.lp .btn.primary{ background:#2563eb; border-color:#2563eb; color:#fff; } body.lp .success{ background:#10b981; color:#062a1f; } /* Tags & chips */ body.lp .chip, body.lp .pill{ background:#ffffff; border:1px solid #e5e7eb; color:#334155; border-radius:999px; padding:6px 10px; font-size:12px; } body.lp .status{ background:#ffffff; border:1px solid #e5e7eb; } /* Stepper (upload/checkout page) */ body.lp .stepper{ color:#64748b; } body.lp .stepper .dot{ background:#ffffff; border:1px solid #e5e7eb; color:#0f172a; } body.lp .stepper .on{ background:linear-gradient(135deg,#22c55e,#10b981); color:#052e1b; border-color:transparent; } /* Progress bar */ body.lp .progress{ background:#f8fafc; border:1px solid #e5e7eb; } body.lp .progress .pct{ color:#052e1b; } /* 3D viewer container (visual only) */ body.lp .viewer{ background:#f8fafc; border:1px solid #e5e7eb; } body.lp .viewer .hint{ color:#64748b; background:rgba(241,245,249,.8); border:1px solid #e5e7eb; } body.lp .viewer .fileBadge{ color:#334155; background:#ffffff; border:1px solid #e5e7eb; } /* Orders page bits */ body.lp .skeleton{ background:#ffffff; border:1px solid #e5e7eb; } body.lp .sk-line{ background:#eef2f7; } body.lp .sk-pill{ background:#eef2f7; } body.lp .timeline{ border-left:2px solid #e5e7eb; } /* Modals */ body.lp .overlay{ background:rgba(0,0,0,.5); } /* Section dividers (used across pages) */ body.lp .divider{ background:#e5e7eb; opacity:1; } /* FAQ details (guides/materials/index patterns) */ body.lp details{ background:#ffffff; border:1px solid #e5e7eb; border-radius:14px; } body.lp details[open]{ border-color:#d7e6ff; } /* Utility */ body.lp [data-invert-on-light]{ filter: invert(1) hue-rotate(180deg); } /* --- Hard override: mobile menu inside #nav-drawer --- */ @media (max-width: 720px){ body.lp #nav-drawer a.link{ background:#0b1220; border:1px solid #1f2937; color:#e5e7eb; } body.lp #nav-drawer .btn{ background:#0b1220; border:1px solid #1f2937; color:#e5e7eb; } body.lp #nav-drawer .pill{ background:#f1f5f9; border:1px solid #e5e7eb; color:#334155; } body.lp #nav-drawer a.link:hover, body.lp #nav-drawer a.link:focus{ background:#111827; outline:2px solid #93c5fd; outline-offset:2px; } } /* Tip lines in light mode */ body.lp #fileNote, body.lp #fileNote2, body.lp #note{ background:#f8fafc; border:1px solid #e5e7eb; color:#64748b; } body.lp #fileNote::before, body.lp #fileNote2::before, body.lp #note::before{ background:#ffffff; color:#2563eb; border-color:#e5e7eb; }