/* Frontend theme: System / Light / Dark (data-theme on ) */ :root, [data-theme="light"] { color-scheme: light; --hewk-bg: #ffffff; --hewk-bg-alt: #f8f8f8; --hewk-bg-card: #ffffff; --hewk-text: #333333; --hewk-text-muted: #666666; --hewk-heading: #212122; --hewk-heading-accent: #061738; --hewk-border: rgba(0, 0, 0, 0.1); --hewk-header-bg: #ffffff; --hewk-nav-link: #061738; --hewk-input-bg: #f8f8f8; --hewk-input-border: #e6e6e6; --hewk-shadow: rgba(0, 0, 0, 0.1); --hewk-dropdown-bg: #ffffff; --hewk-dropdown-text: #333333; --hewk-table-stripe: #f9f9f9; --hewk-modal-bg: #ffffff; --hewk-gradient-start: #eefaf5; --hewk-gradient-end: #ffffff; --hewk-icon-bg-mission: #eefaf5; --hewk-icon-bg-vision: #fffbf0; --hewk-perf-total-start: #eef8f2; --hewk-perf-total-end: #f8fcfa; --hewk-perf-year-start: #fffbf0; --hewk-perf-year-end: #ffffff; --hewk-active-year-row: #f0faf5; --hewk-table-th-soft: #eefaf5; } [data-theme="dark"] { color-scheme: dark; --hewk-bg: #12151c; --hewk-bg-alt: #181c25; --hewk-bg-card: #1c2230; --hewk-text: #d5dbe6; --hewk-text-muted: #9aa3b2; --hewk-heading: #f0f3f8; --hewk-heading-accent: #f0f3f8; --hewk-border: rgba(255, 255, 255, 0.12); --hewk-header-bg: #161b26; --hewk-nav-link: #e8edf5; --hewk-input-bg: #232a38; --hewk-input-border: rgba(255, 255, 255, 0.15); --hewk-shadow: rgba(0, 0, 0, 0.4); --hewk-dropdown-bg: #1c2230; --hewk-dropdown-text: #d5dbe6; --hewk-table-stripe: #1a1f2b; --hewk-modal-bg: #1c2230; --hewk-gradient-start: #1a222d; --hewk-gradient-end: #12151c; --hewk-icon-bg-mission: rgba(3, 182, 100, 0.15); --hewk-icon-bg-vision: rgba(231, 191, 62, 0.15); --hewk-perf-total-start: #1a2a24; --hewk-perf-total-end: #1c2230; --hewk-perf-year-start: #2a2618; --hewk-perf-year-end: #1c2230; --hewk-active-year-row: rgba(3, 182, 100, 0.14); --hewk-table-th-soft: rgba(3, 182, 100, 0.14); } /* Theme switcher button */ .theme-switcher-mini .theme-switcher-btn { background: transparent; border: 0; padding: 0; line-height: 1; cursor: pointer; color: var(--hewk-nav-link); } .theme-switcher-mini .theme-switcher-btn i { font-size: 22px; color: var(--hewk-nav-link); vertical-align: middle; } .theme-switcher-mini .theme-option-icon { width: 40px; height: 40px; border-radius: 50%; background: var(--hewk-bg-alt); display: flex; align-items: center; justify-content: center; } .theme-switcher-mini .theme-option-icon i { font-size: 18px; color: var(--hewk-heading-accent); } .theme-switcher-items .theme-choice-item { cursor: pointer; } .theme-switcher-items .theme-choice-label { display: block; color: inherit; font-weight: 600; } .theme-switcher-items .theme-choice-item.is-active .theme-choice-label { color: #03b664; } .theme-switcher-items .mini-cart-item-des a.is-active, .theme-switcher-items [data-theme-choice].is-active { color: #03b664; } .theme-switcher-items .theme-choice-check { margin-left: 4px; } /* Base */ [data-theme="dark"] body { background-color: var(--hewk-bg); color: var(--hewk-text); } [data-theme="dark"] p, [data-theme="dark"] li, [data-theme="dark"] .about-widget p, [data-theme="dark"] .widget p { color: var(--hewk-text); } [data-theme="dark"] h1, [data-theme="dark"] h2, [data-theme="dark"] h3, [data-theme="dark"] h4, [data-theme="dark"] h5, [data-theme="dark"] h6, [data-theme="dark"] .widget-title h3, [data-theme="dark"] .section-title h2, [data-theme="dark"] .section-title-s2 h2 { color: var(--hewk-heading); } [data-theme="dark"] a { color: #fafdfc; } [data-theme="dark"] a:hover, [data-theme="dark"] a:focus { color: #7ee8b3; } /* Header */ [data-theme="dark"] .header-style-2 .navigation .navbar-brand, [data-theme="dark"] .header-style-2 #navbar > ul li a, [data-theme="dark"] .header-style-2 .cart-search-contact .fi:before { color: var(--hewk-nav-link); } [data-theme="dark"] .tp-site-header .navbar-default { background: var(--hewk-header-bg); } [data-theme="dark"] .header-style-2 .navbar-default { border-bottom: 1px solid var(--hewk-border); } [data-theme="dark"] .tp-site-header .cart-search-contact .mini-cart-content, [data-theme="dark"] .tp-site-header .cart-search-contact .header-search-form { background: var(--hewk-dropdown-bg); border-color: var(--hewk-border); box-shadow: 0 8px 30px var(--hewk-shadow); } [data-theme="dark"] .tp-site-header .cart-search-contact .mini-cart-content p, [data-theme="dark"] .tp-site-header .cart-search-contact .mini-cart-content .mini-cart-item-des a, [data-theme="dark"] .tp-site-header .cart-search-contact .mini-cart-content .mini-cart-item-des .mini-cart-item-price { color: var(--hewk-dropdown-text); } [data-theme="dark"] .tp-site-header .cart-search-contact .mini-cart-content .mini-cart-item { border-color: var(--hewk-border); } @media (max-width: 991px) { [data-theme="dark"] .tp-site-header #navbar { background: var(--hewk-header-bg); border-color: var(--hewk-border); } [data-theme="dark"] .tp-site-header #navbar ul a { color: var(--hewk-nav-link); } [data-theme="dark"] .tp-site-header #navbar > ul .sub-menu { background: var(--hewk-bg-alt); } } @media screen and (min-width: 992px) { [data-theme="dark"] .header-style-2 #navbar > ul .sub-menu { background: var(--hewk-dropdown-bg); border: 1px solid var(--hewk-border); } [data-theme="dark"] .header-style-2 #navbar > ul > li .sub-menu a { color: var(--hewk-dropdown-text); } [data-theme="dark"] .header-style-2 #navbar > ul > li .sub-menu a:hover { color: #4dd994; } } /* Sections & cards */ [data-theme="dark"] .index-about-section, [data-theme="dark"] .features-area, [data-theme="dark"] .about-area, [data-theme="dark"] .event-area, [data-theme="dark"] .contact-pg-contact-section, [data-theme="dark"] .service-area, [data-theme="dark"] .team-area, [data-theme="dark"] .blog-section, [data-theme="dark"] .faq-section, [data-theme="dark"] .performance-area, [data-theme="dark"] .annual-performance-section { background-color: var(--hewk-bg-alt) !important; } [data-theme="dark"] .index-about-mv-card, [data-theme="dark"] .index-about-works, [data-theme="dark"] .about-trust-cert, [data-theme="dark"] .about-icon-item, [data-theme="dark"] .team-item, [data-theme="dark"] .blog-grids .grid, [data-theme="dark"] .event-item, [data-theme="dark"] .news-item, [data-theme="dark"] .performance-card, [data-theme="dark"] .annual-perf-stat-card, [data-theme="dark"] .sipas-leader-card, [data-theme="dark"] .contact-youtube-card, [data-theme="dark"] .contact-social-follow .contact-facebook-card { background: var(--hewk-bg-card); box-shadow: 0 4px 24px var(--hewk-shadow); } [data-theme="dark"] .index-about-mv-card p, [data-theme="dark"] .index-about-body p, [data-theme="dark"] .index-about-content p, [data-theme="dark"] .index-about-tagline { color: var(--hewk-text); } [data-theme="dark"] .index-about-heading, [data-theme="dark"] .index-about-mv-card h3 { color: var(--hewk-heading); } [data-theme="dark"] .index-about-works h3 { color: #4dd994; } [data-theme="dark"] .index-about-works-list li { color: var(--hewk-text); } [data-theme="dark"] .index-about-works-list li i { color: #4dd994; } [data-theme="dark"] .index-about-quote { background: linear-gradient(180deg, rgba(3, 182, 100, 0.14) 0%, rgba(3, 182, 100, 0.06) 100%); color: var(--hewk-heading); border-left-color: #4dd994; } [data-theme="dark"] .index-about-quote i { color: #4dd994; } /* Events */ [data-theme="dark"] .event-item .event-right h2, [data-theme="dark"] .event-item .event-right h2 a { color: var(--hewk-heading); } [data-theme="dark"] .event-item .event-right p { color: var(--hewk-text); } [data-theme="dark"] .event-item .event-right ul li:first-child { color: #4dd994; } [data-theme="dark"] .event-item .event-right ul li:last-child { color: #ffc039; } [data-theme="dark"] .event-item .event-right h2 a:hover { color: #ffc039; } [data-theme="dark"] .event-item:hover .event-right ul li, [data-theme="dark"] .event-item:hover .event-right h2, [data-theme="dark"] .event-item:hover .event-right h2 a, [data-theme="dark"] .event-item:hover .event-right p { color: #fff; } [data-theme="dark"] .event-category-badge { background: rgba(3, 182, 100, 0.15); color: #4dd994; } [data-theme="dark"] .index-upcoming-event .event-countdown { color: #4dd994; } [data-theme="dark"] .events-empty-message { color: var(--hewk-text-muted); } /* Pillars (Five Pillars icons) */ [data-theme="dark"] .plr-bx { background: var(--hewk-bg-card); border-color: var(--hewk-border); box-shadow: 0 4px 20px var(--hewk-shadow); } [data-theme="dark"] .plr-bx:hover { background: var(--hewk-bg-alt); } /* Forms */ [data-theme="dark"] input, [data-theme="dark"] textarea, [data-theme="dark"] select, [data-theme="dark"] .form-control { background-color: var(--hewk-input-bg); border-color: var(--hewk-input-border); color: var(--hewk-text); } [data-theme="dark"] input::placeholder, [data-theme="dark"] textarea::placeholder { color: var(--hewk-text-muted); } /* Tables */ [data-theme="dark"] table.dataTable, [data-theme="dark"] table.dataTable thead th, [data-theme="dark"] table.dataTable tbody td { background-color: var(--hewk-bg-card); color: var(--hewk-text); border-color: var(--hewk-border); } [data-theme="dark"] table.dataTable.stripe tbody tr.odd, [data-theme="dark"] table.dataTable.display tbody tr.odd { background-color: var(--hewk-table-stripe); } [data-theme="dark"] .dataTables_wrapper .dataTables_length, [data-theme="dark"] .dataTables_wrapper .dataTables_filter, [data-theme="dark"] .dataTables_wrapper .dataTables_info, [data-theme="dark"] .dataTables_wrapper .dataTables_paginate { color: var(--hewk-text); } /* Modals */ [data-theme="dark"] .modal-content { background-color: var(--hewk-modal-bg); color: var(--hewk-text); border-color: var(--hewk-border); } [data-theme="dark"] .modal-header, [data-theme="dark"] .modal-footer { border-color: var(--hewk-border); } [data-theme="dark"] .modal-title { color: var(--hewk-heading); } [data-theme="dark"] .close { color: var(--hewk-text); opacity: 0.8; } /* Footer stays dark; slight tweak */ [data-theme="dark"] .tp-site-footer { background-color: #0d1017; } [data-theme="dark"] .tp-lower-footer { border-top: 1px solid var(--hewk-border); } /* Misc content blocks */ [data-theme="dark"] .thumb-text, [data-theme="dark"] .section-title .thumb-text { color: #4dd994; } [data-theme="dark"] .breadcrumb li, [data-theme="dark"] .breadcrumb li a { color: var(--hewk-text-muted); } [data-theme="dark"] .panel, [data-theme="dark"] .well { background-color: var(--hewk-bg-card); border-color: var(--hewk-border); color: var(--hewk-text); } [data-theme="dark"] .annual-perf-year-tabs .nav-tabs > li > a { background: var(--hewk-bg-card); color: var(--hewk-text); border-color: var(--hewk-border); } [data-theme="dark"] .annual-perf-year-tabs .nav-tabs > li.active > a, [data-theme="dark"] .annual-perf-year-tabs .nav-tabs > li.active > a:hover, [data-theme="dark"] .annual-perf-year-tabs .nav-tabs > li.active > a:focus { background: var(--hewk-bg-alt); color: var(--hewk-heading); border-color: var(--hewk-border); } /* About page trust certificate */ [data-theme="dark"] .about-trust-cert-box p { color: var(--hewk-text); } /* Sipas & intro text */ [data-theme="dark"] .sipas-intro-note { color: var(--hewk-text-muted); } [data-theme="dark"] .sipas-memory-badge { color: #4dd994; } /* Press notes */ [data-theme="dark"] .press-cutting-panel .panel-body, [data-theme="dark"] .press-notes-empty h3, [data-theme="dark"] .press-notes-empty p { color: var(--hewk-text); } /* Trust property & donors */ [data-theme="dark"] .trust-property-card p, [data-theme="dark"] .trust-property-card li, [data-theme="dark"] .donors-empty-tab h3, [data-theme="dark"] .donors-empty-tab p, [data-theme="dark"] .performance-summary-table td, [data-theme="dark"] .performance-detail-table td { background: var(--hewk-bg-card); color: var(--hewk-text); border-color: var(--hewk-border); } [data-theme="dark"] .volunteer-area.v2, [data-theme="dark"] .trust-property-section, [data-theme="dark"] .press-notes-section { background: var(--hewk-bg-alt); } [data-theme="dark"] .performance-stats-block-total { background: linear-gradient(180deg, var(--hewk-perf-total-start) 0%, var(--hewk-perf-total-end) 100%); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); } [data-theme="dark"] .performance-stats-block-year { background: linear-gradient(180deg, var(--hewk-perf-year-start) 0%, var(--hewk-perf-year-end) 100%); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.35); } [data-theme="dark"] .performance-totals-heading h3, [data-theme="dark"] .performance-year-heading h3 { color: var(--hewk-heading); } [data-theme="dark"] .samajwadi-location { color: #4dd994; } [data-theme="dark"] .samajwadi-rate-table td { background: var(--hewk-bg-card); color: var(--hewk-text); border-color: var(--hewk-border); } [data-theme="dark"] .trust-property-samajwadi-link { color: var(--hewk-text); border-top-color: var(--hewk-border); } [data-theme="dark"] .samajwadi-card p, [data-theme="dark"] .donors-samajwadi-card p { color: var(--hewk-text); } /* Performance stats */ [data-theme="dark"] .performance-stat-card h3, [data-theme="dark"] .performance-panel h3, [data-theme="dark"] .performance-panel p { color: var(--hewk-heading); } [data-theme="dark"] .performance-stat-card-total { border-color: rgba(3, 182, 100, 0.35); } [data-theme="dark"] .performance-stat-card-total .performance-stat-value { color: #4dd994; } [data-theme="dark"] .performance-stat-card-year .performance-stat-value { color: #ffc039; } /* Activity details pages */ [data-theme="dark"] .activity-details-area { background: var(--hewk-bg-alt); } [data-theme="dark"] .activity-related-list li a:hover, [data-theme="dark"] .activity-related-list li.active a { color: #4dd994; } [data-theme="dark"] .activity-details-sidebar .activity-event-post-link:hover .activity-event-title { color: #4dd994; } [data-theme="dark"] .activity-scheme-card { background: var(--hewk-bg-card); border-color: rgba(3, 182, 100, 0.28) !important; } [data-theme="dark"] .activity-scheme-total { background: linear-gradient(180deg, var(--hewk-perf-total-start) 0%, var(--hewk-perf-total-end) 100%); } [data-theme="dark"] .activity-scheme-total-amount, [data-theme="dark"] .activity-scheme-amount { color: #4dd994; } [data-theme="dark"] .activity-details-hero p, [data-theme="dark"] .activity-details-commitment p, [data-theme="dark"] .activity-details-year-panel p, [data-theme="dark"] .activity-details-records p, [data-theme="dark"] .activity-schemes-panel p, [data-theme="dark"] .activity-details-sidebar .widget p { color: var(--hewk-text); } /* Volunteer & committee */ [data-theme="dark"] .volunteer-contact-form p, [data-theme="dark"] .volunteer-wrap .volunteer-content p, [data-theme="dark"] .committee-president-card p, [data-theme="dark"] .committee-group-photo p { color: var(--hewk-text); } /* Features icon decorative ring */ [data-theme="dark"] .features-icon:before { background: rgba(255, 255, 255, 0.08); } /* Event detail tabs */ [data-theme="dark"] .tp-event-details-tab .nav li a { color: var(--hewk-text); } [data-theme="dark"] .tp-event-details-tab .nav li.active a, [data-theme="dark"] .tp-event-details-tab .nav li:hover a { color: var(--hewk-heading); } /* Payment form labels */ [data-theme="dark"] .tp-payment-area label, [data-theme="dark"] .tp-payment-area p { color: var(--hewk-text); } /* Legal / policy pages */ [data-theme="dark"] .legal-document { background: var(--hewk-bg-card); } [data-theme="dark"] .legal-updated, [data-theme="dark"] .legal-contact { border-color: var(--hewk-border); } [data-theme="dark"] .legal-contact a { color: #a8d44a; } /* Our Journey timeline */ [data-theme="dark"] .journey-area--kutch { background: var(--hewk-bg); } [data-theme="dark"] .journey-desert-scene { background: transparent; border: none; box-shadow: none; } [data-theme="dark"] .journey-event-card { background: rgba(26, 31, 38, 0.92); border-color: rgba(201, 162, 39, 0.22); } [data-theme="dark"] .journey-event-card--start { background: linear-gradient(145deg, rgba(26, 31, 38, 0.96), rgba(115, 145, 17, 0.12)); } [data-theme="dark"] .journey-event-card--end { background: linear-gradient(145deg, rgba(26, 31, 38, 0.96), rgba(201, 162, 39, 0.1)); } [data-theme="dark"] .journey-mosque-silhouette { fill: #a8d44a; opacity: 0.05; } [data-theme="dark"] .journey-stat-pill strong { color: #a8d44a; } [data-theme="dark"] .journey-stat-pill--age strong.journey-stat-age { color: #a8d44a; } [data-theme="dark"] .journey-stat-pill { border-color: var(--hewk-border); } [data-theme="dark"] .journey-road-lane-body { background: linear-gradient(180deg, #f0f0f0 0%, #e0e0e0 48%, #d0d0d0 100%); border-color: #c8c8c8; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), inset 0 -2px 4px rgba(0, 0, 0, 0.08), 0 2px 8px rgba(0, 0, 0, 0.25); } [data-theme="dark"] .journey-road-lane-arrows { color: #1a1a1a; } [data-theme="dark"] .journey-road-lane-dash { border-top-color: rgba(0, 0, 0, 0.55); } [data-theme="dark"] .journey-road-connector-bg { stroke: #e8e8e8; } [data-theme="dark"] .journey-road-connector-line { stroke: rgba(0, 0, 0, 0.55); } [data-theme="dark"] .journey-road-connector-head { fill: #1a1a1a; } [data-theme="dark"] .journey-road-row-dir { background: #f0f0f0; color: #1a1a1a; border-color: #d8d8d8; } [data-theme="dark"] .journey-car-icon { filter: drop-shadow(0 3px 10px rgba(0, 0, 0, 0.55)) brightness(1.05); } [data-theme="dark"] .journey-car-btn { background: linear-gradient(135deg, #5a7a12, #739111); border-color: rgba(201, 162, 39, 0.3); } [data-theme="dark"] .journey-drive-progress-track { background: rgba(115, 145, 17, 0.22); }