/* ============================================================
   Creativus — Light Mode override stylesheet
   ------------------------------------------------------------
   This file ONLY contains rules scoped to html[data-theme="light"].
   Dark mode (default / data-theme="dark") is unaffected.
   Brand segment colors (green/amber/orange/red/purple/blue/gold)
   are preserved across both themes.
   ============================================================ */

/* ---- Page surfaces ---------------------------------------- */
html[data-theme="light"], html[data-theme="light"] body{background:#fafafa;color:#0a0a0a;}
html[data-theme="light"] body::before{background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,0.035) 2px,rgba(0,0,0,0.035) 4px);}
html[data-theme="light"] body::after{background:radial-gradient(ellipse at center,transparent 60%,rgba(0,0,0,0.06) 100%);}

/* ---- Top nav --------------------------------------------- */
html[data-theme="light"] .back-btn,
html[data-theme="light"] .profile-btn,
html[data-theme="light"] .legends-btn{color:#0a0a0a;border-color:#c8c8c8;background:none;}
html[data-theme="light"] .back-btn:hover,
html[data-theme="light"] .profile-btn:hover{color:#0a0a0a;border-color:#666;}
html[data-theme="light"] .logo-mini span{color:#0a0a0a;}
html[data-theme="light"] .page-title{color:#0a0a0a;}
html[data-theme="light"] .username{color:#0a0a0a;}
html[data-theme="light"] .edit-modal-title{color:#0a0a0a;}
html[data-theme="light"] .edit-modal-close{color:#999;}
html[data-theme="light"] .edit-modal-close:hover{color:#0a0a0a;}
html[data-theme="light"] .post-edit-btn:hover{border-color:#0a0a0a;color:#0a0a0a;}

/* ---- Dividers / generic borders -------------------------- */
html[data-theme="light"] .divider{background:#dcdcdc;}

/* ---- Filter / sort / tab / sub / pill buttons ------------ */
html[data-theme="light"] .filter,
html[data-theme="light"] .sort-btn,
html[data-theme="light"] .tab-btn,
html[data-theme="light"] .sub-btn,
html[data-theme="light"] .seg-btn,
html[data-theme="light"] .pg-btn,
html[data-theme="light"] .tf-btn,
html[data-theme="light"] .toggle-btn,
html[data-theme="light"] .exclude-toggle,
html[data-theme="light"] .exclude-btn,
html[data-theme="light"] .grid-btn,
html[data-theme="light"] .add-btn,
html[data-theme="light"] .settings-btn,
html[data-theme="light"] .msg-btn,
html[data-theme="light"] .map-ctrl{border-color:#c8c8c8;color:#666;background:none;}

/* ---- Card grids / cards ---------------------------------- */
html[data-theme="light"] .card{border-color:#d4d4d4;background:#fff;}
html[data-theme="light"] .card .preview,
html[data-theme="light"] .preview{border-bottom-color:#e2e2e2;background:#fafafa;}
html[data-theme="light"] .card-title{color:#222;}
html[data-theme="light"] .card-submitter{color:#777;}
html[data-theme="light"] .user-link:hover{color:#444;}

html[data-theme="light"] .votes-badge{background:#fff;}
html[data-theme="light"] .type-badge{background:rgba(255,255,255,0.85);color:#222;}

/* ---- Submit bar / inputs --------------------------------- */
html[data-theme="light"] .submit-bar{border-color:#c8c8c8;background:#fff;}
html[data-theme="light"] .submit-bar input,
html[data-theme="light"] .submit-url,
html[data-theme="light"] .submit-title{background:#fff;color:#0a0a0a;border-bottom-color:#c8c8c8;}
html[data-theme="light"] .submit-bar input::placeholder,
html[data-theme="light"] .submit-url::placeholder,
html[data-theme="light"] .submit-title::placeholder{color:#bbb;}

/* ---- Generic fields (modals, forms) ---------------------- */
html[data-theme="light"] .field,
html[data-theme="light"] input.field,
html[data-theme="light"] textarea.field{background:#fff;color:#0a0a0a;border-color:#c8c8c8;}
html[data-theme="light"] .field:focus{border-color:#666;}
html[data-theme="light"] .field::placeholder{color:#bbb;}

/* ---- Modals ---------------------------------------------- */
html[data-theme="light"] #moverlay,
html[data-theme="light"] .modal-overlay,
html[data-theme="light"] .moverlay{background:rgba(255,255,255,0.78);}
html[data-theme="light"] .modal-box,
html[data-theme="light"] .modal,
html[data-theme="light"] .edit-box,
html[data-theme="light"] .embed-modal,
html[data-theme="light"] #avatarCropBox,
html[data-theme="light"] #bgModalBox{background:#fff;border-color:#d4d4d4;color:#0a0a0a;}
html[data-theme="light"] .modal-title{color:#0a0a0a;}
html[data-theme="light"] .modal-close{color:#999;}
html[data-theme="light"] .modal-close:hover{color:#0a0a0a;}
html[data-theme="light"] .modal-or{color:#bbb;}
html[data-theme="light"] .modal-note{color:#888;}
html[data-theme="light"] .edit-input,
html[data-theme="light"] .embed-search{background:#fff;color:#0a0a0a;border-color:#c8c8c8;}
html[data-theme="light"] .edit-file-btn{background:#fff;color:#666;border-color:#c8c8c8;}
html[data-theme="light"] .edit-divider{background:#dcdcdc;}

/* ---- Primary button (flip white-on-black to black-on-white) ---- */
html[data-theme="light"] .btn-primary{background:#0a0a0a;color:#fff;}
html[data-theme="light"] .btn-primary:hover{background:#222;}

/* ---- Tooltip / floating chips ---------------------------- */
html[data-theme="light"] #tip,
html[data-theme="light"] .tip,
html[data-theme="light"] .tooltip{background:#fff;color:#0a0a0a;border-color:#c8c8c8;}

/* ---- Scrollbar (webkit) ---------------------------------- */
html[data-theme="light"] ::-webkit-scrollbar{background:#f0f0f0;}
html[data-theme="light"] ::-webkit-scrollbar-thumb{background:#c0c0c0;}
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:#a0a0a0;}
html[data-theme="light"] ::-webkit-scrollbar-track,
html[data-theme="light"] ::-webkit-scrollbar-corner{background:#f0f0f0 !important;}

/* ---- Settings-tab theme toggle button (profile.html [data-theme-toggle]) ---- */
html[data-theme="light"] .settings-btn{border-color:#666;color:#444;}
html[data-theme="light"] .settings-btn:hover{background:#444;color:#fff;}

/* ============================================================
   Page-specific overrides
   ============================================================ */

/* ---- index.html ----------------------------------------- */
html[data-theme="light"] .site-title{color:#0a0a0a;}
html[data-theme="light"] .site-tag{color:#999;}
/* Donut logo: in light mode, ring every shape (big C arc, colored segments, center disc)
   with the same thin grey line so they read against the light bg. */
html[data-theme="light"] #clogo > path[fill="white"]{fill:#fafafa;stroke:#d4d4d4;stroke-width:1.5;}
html[data-theme="light"] #clogo .arc-s{stroke:#d4d4d4;stroke-width:1.5;}
html[data-theme="light"] #clogo .center-btn circle{stroke:#d4d4d4;stroke-width:1.5;}
@keyframes centerFlashLight{0%,100%{filter:drop-shadow(0 0 0px rgba(0,0,0,0))}50%{filter:drop-shadow(0 0 16px rgba(0,0,0,0.35))}}
html[data-theme="light"] .center-flashing{animation-name:centerFlashLight;}

/* ---- posts/videos/vote: vote chip, del chip ----------- */
html[data-theme="light"] .vote-btn{color:#bbb;border-color:#d8d8d8;}
html[data-theme="light"] .del-btn{background:#fff;color:#999;border-color:#e0c8c8;}
html[data-theme="light"] .edit-btn{background:#fff;color:#999;border-color:#c8c8c8;}

/* ---- vote.html ---------------------------------------- */
html[data-theme="light"] .status-bar{background:#f5fff5;border-color:#cfe9cf;}
html[data-theme="light"] .status-dot.disconnected{background:#d0d0d0;}
html[data-theme="light"] .lb-btn{background:#fff;}
html[data-theme="light"] .search-bar{background:#fff;border-color:#c8c8c8;}
html[data-theme="light"] .search-bar input{background:#fff;color:#0a0a0a;}
html[data-theme="light"] .search-dropdown{background:#fff;border-color:#c8c8c8;}
html[data-theme="light"] .search-result:hover{background:#f0f0f0;}
html[data-theme="light"] #rate-popup{background:#fff;}
html[data-theme="light"] .legend-dot[style*="background:#1a1a1a"]{background:#d0d0d0 !important;border-color:#a0c0a0 !important;}

/* ---- Chat (chat-general.html, chat-map.html) ------------ */
html[data-theme="light"] .cc-box{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .general-btn{background:#fff;}
html[data-theme="light"] .map-ctrl{background:#fff;color:#666;}
html[data-theme="light"] .map-hover-label{background:#fff;}
html[data-theme="light"] .country-shape,
html[data-theme="light"] svg.cc-map path:not([fill]):not(.country-active){fill:#eaeaea;stroke:#c8c8c8;}
/* chat-map.html resting state — JS sets fill via inline style during ripple, but at rest fill is unset so this applies */
html[data-theme="light"] #worldSvg path.country{fill:#d8d8d8;stroke:#bfbfbf;}
html[data-theme="light"] #worldSvg .grid-major{stroke:#c0c0c0;}
html[data-theme="light"] .msg-avatar{background:#f0f0f0;border-color:#d4d4d4;color:#888;}
html[data-theme="light"] .embed{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .embed-thumb,
html[data-theme="light"] .embed-result-thumb{background:#f0f0f0;border-color:#d4d4d4;}
html[data-theme="light"] .embed-vote{background:#fff;}
html[data-theme="light"] .react{background:#f0f0f0;border-color:#d4d4d4;color:#222;}
html[data-theme="light"] .msg-tools,
html[data-theme="light"] .dm-msg-tools{background:#fff;}
html[data-theme="light"] .tool-btn,
html[data-theme="light"] .dm-tool-btn{background:#fff;border-color:#c8c8c8;color:#666;}
html[data-theme="light"] .picker,
html[data-theme="light"] .dm-picker{background:#fff;border-color:#c8c8c8;}
html[data-theme="light"] .pick:hover,
html[data-theme="light"] .dm-pick:hover{background:#f0f0f0;border-color:#999;}
html[data-theme="light"] .attach-preview{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .compose-row textarea,
html[data-theme="light"] .dm-compose textarea{background:#fff;color:#0a0a0a;border-color:#c8c8c8;}
html[data-theme="light"] .toast{background:#fff;}

/* ---- Messages / DMs ------------------------------------- */
html[data-theme="light"] .dm-search input{background:#fff;color:#0a0a0a;border-bottom-color:#c8c8c8;}
html[data-theme="light"] .dm-search-results{background:#fff;border-color:#c8c8c8;}
html[data-theme="light"] .dm-search-result:hover{background:#f0f0f0;color:#0a0a0a;}
html[data-theme="light"] .dm-conv:hover{background:#f0f0f0;}
html[data-theme="light"] .dm-conv.active{background:#ececec;border-left-color:#666;}
html[data-theme="light"] .dm-msg.own .dm-bubble{color:#0a0a0a;background:#eaf3ea;border-color:#cfe9cf;}
html[data-theme="light"] .dm-msg.peer .dm-bubble{color:#222;background:#f0f0f0;border-color:#d4d4d4;}
html[data-theme="light"] .dm-react{background:#f0f0f0;border-color:#d4d4d4;color:#222;}
html[data-theme="light"] .dm-react.mine{background:#e8e8e8;border-color:#999;}
html[data-theme="light"] .dm-meta,
html[data-theme="light"] .dm-time{color:#999;}
html[data-theme="light"] .dm-send-btn{color:#666;}

/* ---- Leaderboard ---------------------------------------- */
html[data-theme="light"] .lb-card,
html[data-theme="light"] .lb-row{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .lb-rank{color:#0a0a0a;}
html[data-theme="light"] .lb-username{color:#222;}
html[data-theme="light"] .lb-stat{color:#666;}

/* ---- Legends -------------------------------------------- */
html[data-theme="light"] .legend-card{background:#fff;border-color:#d4d4d4;}

/* ---- Profile ------------------------------------------- */
html[data-theme="light"] .stats-row{background:#dcdcdc;border-color:#c8c8c8;}
html[data-theme="light"] .stat-cell{background:#fff;}
html[data-theme="light"] .stat-cell-link:hover{background:#fff8ee;}
html[data-theme="light"] .post-row{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .post-empty{background:#fff;border-color:#d4d4d4;color:#999;}
html[data-theme="light"] .post-edit-btn{background:#fff;border-color:#c8c8c8;color:#666;}
html[data-theme="light"] .badge-card{background:#fff;}
html[data-theme="light"] .settings-block,
html[data-theme="light"] .customize-block{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .settings-field{background:#fff;color:#0a0a0a;border-bottom-color:#c8c8c8;}
html[data-theme="light"] .customize-btn{background:#fff;border-color:#c8c8c8;color:#666;}
html[data-theme="light"] .customize-banner{background:#fff;}
html[data-theme="light"] .pal-item{background:#fff;border-color:#c8c8c8;color:#666;}
html[data-theme="light"] .pal-variants{background:#fff;border-color:#999;}
html[data-theme="light"] .pal-variant{background:#fff;border-color:#c8c8c8;}
html[data-theme="light"] .sticker-h{background:#fff;color:#666;border:1px solid #c8c8c8;}
html[data-theme="light"] #bgPreviewWrap{background:#fafafa;border-color:#d4d4d4;}
html[data-theme="light"] .dl-btn{background:#fff;border-color:#c8c8c8;color:#666;}
html[data-theme="light"] .msg-btn{background:#fff;color:#666;border-color:#c8c8c8;}
html[data-theme="light"] .block-btn{background:#fff;color:#a04040;border-color:#d4a4a4;}
html[data-theme="light"] .stat-label,
html[data-theme="light"] .stat-num{color:#0a0a0a;}
html[data-theme="light"] .ach-card,
html[data-theme="light"] .achievement,
html[data-theme="light"] .stat-box{background:#fff;border-color:#d4d4d4;}
html[data-theme="light"] .ach-name{color:#0a0a0a;}
html[data-theme="light"] .ach-desc{color:#666;}

/* ---- About / Support / Crypto / Suggestions ------------ */
html[data-theme="light"] .info-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .roadmap-item,
html[data-theme="light"] .suggestion-card,
html[data-theme="light"] .suggestion-row,
html[data-theme="light"] .sg-card{background:#fff;border-color:#d4d4d4;color:#222;}
html[data-theme="light"] .sub-label{color:#777;}

/* ---- Auth modal (auth.js injected with inline styles — use !important) ---- */
html[data-theme="light"] #authOverlay{background:rgba(255,255,255,0.82) !important;}
html[data-theme="light"] #authOverlay > div{background:#fff !important;border-color:#d4d4d4 !important;}
html[data-theme="light"] #authOverlay > div > div:first-child{color:#888 !important;}
html[data-theme="light"] #authTitle{color:#0a0a0a !important;}
html[data-theme="light"] #authOverlay > div > div[style*="background:#111"]{background:#dcdcdc !important;}
html[data-theme="light"] #authUsername,
html[data-theme="light"] #authEmail,
html[data-theme="light"] #authPassword{background:#fff !important;color:#0a0a0a !important;border-bottom-color:#c8c8c8 !important;}
html[data-theme="light"] #authForgotBtn{color:#999 !important;}
html[data-theme="light"] #authSubmit{border-color:#0a0a0a !important;color:#0a0a0a !important;}
html[data-theme="light"] #authSwitchLabel{color:#888 !important;}
html[data-theme="light"] #authSwitch{color:#666 !important;}
html[data-theme="light"] #authClose{border-color:#c8c8c8 !important;color:#888 !important;}
/* Topbar auth buttons injected by auth.js (LOG IN / PROFILE / SIGN OUT) */
html[data-theme="light"] #loginBtn,
html[data-theme="light"] #signOutBtn,
html[data-theme="light"] .topbar-right > a[href="profile.html"]{color:#0a0a0a !important;border-color:#c8c8c8 !important;}

/* ---- Selection ----------------------------------------- */
html[data-theme="light"] ::selection{background:rgba(0,0,0,0.15);color:#0a0a0a;}

/* ============================================================
   Safety-net broad overrides — catch common dark-color patterns
   on selectors not enumerated above. Lower-specificity rules so
   the page-specific ones above can still win.
   ============================================================ */
html[data-theme="light"] textarea,
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="url"]{color:#0a0a0a;}
html[data-theme="light"] textarea::placeholder,
html[data-theme="light"] input::placeholder{color:#bbb;}
