/* ONFIX FINAL LIGHT PASS — 2026-09-18
   Loaded last on public pages. Visual-only overrides: white surfaces, black text,
   clear black outlines. Functional JS/PHP behavior is untouched. */
:root{
  color-scheme:light!important;
  --bg:#e5e0d7!important;--surface:#fff!important;--surface2:#fff!important;
  --panel:#fff!important;--card:#fff!important;--text:#111!important;
  --muted:#626a75!important;--line:#111!important;
}
html,body{background:#fff!important;background-image:none!important;color:#111!important;color-scheme:light!important}
body::before,body::after{background:none!important}

/* Typography */
body h1,body h2,body h3,body h4,body h5,body h6,body strong,body b{color:#111!important;text-shadow:none!important}
body p,body li,body label,body small,body span{ text-shadow:none!important }
body a{color:#111}

/* Inputs and controls */
body input:not([type="checkbox"]):not([type="radio"]),body select,body textarea{
  background:#fff!important;background-image:none!important;color:#111!important;
  border:2px solid #111!important;box-shadow:none!important;
}
body input::placeholder,body textarea::placeholder{color:#777!important;opacity:1!important}
body button,body .btn,body a.btn,body .button,body a.button,body input[type="submit"],body input[type="button"]{
  background:#fff!important;background-image:none!important;color:#111!important;
  border:2px solid #111!important;box-shadow:none!important;text-shadow:none!important;
}
body button:hover,body .btn:hover,body a.btn:hover,body .button:hover,body a.button:hover{background:#f3f3f3!important;color:#111!important}

/* Main navigation/header/footer surfaces */
.site-header,.search-header,.catalog-header,.seo-top,.dashboard-topnav,.site-footer,.customer-footer,
.footer-panel,.footer-location-pro,.footer-location-pro--elegant,.footer-grid>div{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.site-header,.search-header,.catalog-header,.seo-top{border-bottom:2px solid #111!important}
.site-footer,.customer-footer{border-top:2px solid #111!important}

/* Home sections and the "Մեր աշխատանքները" / real-work section */
.section,.section--dark,.section.section--dark,.stats-section,.cta-section,.cta-inner,
.real-works,.real-works-section,.works-section,.work-section,[class*="works-section"],[class*="real-work"]{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.section--dark,.section.section--dark,.real-works,.real-works-section,.works-section,.work-section{
  border-top:2px solid #111!important;border-bottom:2px solid #111!important;
}
.service-card,.video-card,.work-card,.works-card,.work-item,.works-item,.portfolio-card,.gallery-card,
[class*="work-card"],[class*="works-card"],[class*="portfolio-card"]{
  background:#fff!important;background-image:none!important;color:#111!important;
  border:2px solid #111!important;box-shadow:none!important;
}
.service-card p,.video-card p,.work-card p,.works-card p,.work-item p,.works-item p{color:#626a75!important}
.video-card video,.work-card img,.works-card img,.work-item img,.works-item img{background:#fff!important;border-color:#111!important}
.filter-btn,.filter-pill,.work-filter,.works-filter,.status-filter,[class*="filter-pill"],[class*="status-filter"]{
  background:#fff!important;color:#111!important;border:2px solid #111!important;box-shadow:none!important;
}
.filter-btn.active,.filter-pill.active,.work-filter.active,.works-filter.active,.status-filter.active{background:#ececec!important;color:#111!important}

/* Product detail pages — all products use product.php */
.detail{background:#fff!important;color:#111!important}
.mainMedia{
  background:#fff!important;background-image:none!important;border:2px solid #111!important;
  border-radius:22px!important;box-shadow:none!important;
}
.mainMedia img,.mainMedia video{background:#fff!important}
.thumbs{background:#fff!important}
.thumbBtn{
  background:#fff!important;color:#111!important;border:2px solid #111!important;box-shadow:none!important;
}
.thumbBtn.active{border:3px solid #111!important}
.videoBtn{color:#111!important}
.info{
  background:#fff!important;background-image:none!important;color:#111!important;
  border:2px solid #111!important;box-shadow:none!important;
}
.info h1,.info p,.info strong,.info small{color:#111!important}
.info .desc{color:#555!important}
.info .views{background:#fff!important;color:#111!important;border:2px solid #111!important}
.price{color:#8a6b15!important}
.back{color:#111!important;border:2px solid #111!important;border-radius:12px!important;padding:10px 14px!important;width:max-content;background:#fff!important}

/* Catalog, brands and brand product pages */
.catalog-hero,.brand-page-head,.brand-detail-logo,.brand-empty,.product-card,.catalog-empty,
.brand-grid .brand-button,.brand-admin-note,.brand-result-head{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.catalog-hero,.brand-page-head,.brand-empty,.product-card,.brand-grid .brand-button,.brand-detail-logo{border:2px solid #111!important;box-shadow:none!important}
.product-image,.product-body{background:#fff!important;color:#111!important}
.product-image{border-bottom:2px solid #111!important}
.product-title,.brand-result-head h2,.brand-result-head span{color:#111!important}
.product-heart{background:#fff!important;color:#111!important;border:2px solid #111!important}
.catalog-search,.category-pill,.catalog-btn,.catalog-back{background:#fff!important;color:#111!important;border:2px solid #111!important}
.category-pill.active{background:#ececec!important}

/* SEO repair/model/service pages */
.seo-main,.seo-hero,.seo-card,.seo-check-list li,.seo-steps li,.seo-faq details,
.model-card,.model-part-card,.model-no-results,.brand-models-meta,.model-search,.year-filter,.seo-cta{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.seo-hero,.seo-card,.seo-check-list li,.seo-steps li,.seo-faq details,.model-card,.model-part-card,.model-no-results,.brand-models-meta,.model-search,.year-filter,.seo-cta{border:2px solid #111!important;box-shadow:none!important}
.model-card[hidden]{display:none!important}
.model-search input{border:0!important}
.year-filter.active{background:#ececec!important}

/* Search results */
.search-form,.result-card,.empty{background:#fff!important;background-image:none!important;color:#111!important;border:2px solid #111!important;box-shadow:none!important}
.result-image{background:#fff!important;color:#111!important;border:2px solid #111!important}
.result-card p,.search-meta,.empty{color:#5d6570!important}

/* Customer dashboard/cart and request pages */
.customer-kpi,.quick-customer-actions a,.box,.order-card,.dashboard-support-chat,.gift-modal,
.cart-shell,.cart-card,.cart-item,.cart-summary,.cart-panel,.order-panel,.request-card,
[class*="cart-card"],[class*="cart-item"],[class*="cart-summary"]{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.customer-kpi,.quick-customer-actions a,.box,.order-card,.dashboard-support-chat,.cart-card,.cart-item,.cart-summary,.cart-panel,.request-card{border:2px solid #111!important;box-shadow:none!important}

/* Video page: the page and controls are light; media itself is not forced dark. */
.reels,.reel,.reels-head,.comment-sheet,.comment-form,.comment-list{background:#fff!important;background-image:none!important;color:#111!important}
.reel{border:2px solid #111!important}
.reel>video{background:#fff!important}
.reel-gradient{background:linear-gradient(transparent 45%,rgba(255,255,255,.76) 72%,rgba(255,255,255,.98))!important}
.sound,.reel-actions span,.comment-head button{background:#fff!important;color:#111!important;border:2px solid #111!important}
.reel-actions button,.reel-actions .views,.reel-actions b,.reel-actions small{color:#111!important}
.comment-sheet{border:2px solid #111!important}

/* Common panels/cards that previously used dark designer themes */
.hero,.quick-facts,.quick-facts-grid,.order-card--premium,.order-layout--premium,.utility-search,.utility-pill,
.utility-icon-btn,.utility-lang-shell,.services-entry-card,.onfix-location-card,.video-hub-card,.floating-card,
.onfix-public-review-card,.onfix-public-review-item,.onfix-chat-panel,.onfix-chat-head,.onfix-chat-form,.onfix-chat-contact,.onfix-chat-msg{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}
.quick-facts,.quick-facts-grid,.order-card--premium,.order-layout--premium,.utility-search,.utility-pill,.utility-icon-btn,.utility-lang-shell,.services-entry-card,.onfix-location-card,.video-hub-card,.floating-card{border:2px solid #111!important;box-shadow:none!important}

/* Catch the remaining old inline dark backgrounds used by legacy public templates. */
[style*="background:#000"],[style*="background: #000"],[style*="background:#050505"],[style*="background:#080a0f"],
[style*="background:#090c11"],[style*="background:#0d1016"],[style*="background:#11151d"],[style*="background:#151922"],
[style*="background: #050505"],[style*="background: #080a0f"],[style*="background: #090c11"],[style*="background: #0d1016"],
[style*="background: #11151d"],[style*="background: #151922"]{
  background:#fff!important;background-image:none!important;color:#111!important;border-color:#111!important;
}

/* Main-page category entry buttons: same strong outline as phones/accessories. */
#onfix-category-menu a,#onfix-category-menu .onfix-commerce-subaction{
  background:#fff!important;color:#111!important;border:2px solid #111!important;box-shadow:none!important;
}

@media(max-width:760px){
  .detail{grid-template-columns:1fr!important;gap:16px!important;margin:14px auto!important;padding:10px!important}
  .mainMedia{height:min(62vh,430px)!important}
  .info{padding:20px!important}
}

/* 2026-09-18 — Floating contact / online chat final placement */
body.onfix-public-admin-light .floating-actions{
  right:20px !important;
  bottom:86px !important;
  z-index:1610 !important;
}
body.onfix-public-admin-light .floating-main{
  background:#fff !important;
  color:#111 !important;
  border:2px solid #111 !important;
  box-shadow:0 8px 20px rgba(20,24,32,.14) !important;
}
body.onfix-public-admin-light .floating-menu{
  right:0 !important;
  bottom:68px !important;
  z-index:1620 !important;
}
body.onfix-public-admin-light .floating-menu .floating-contact,
body.onfix-public-admin-light .floating-menu a{
  background:#fff !important;
  color:#111 !important;
  border:2px solid #111 !important;
  box-shadow:0 8px 18px rgba(20,24,32,.12) !important;
}
body.onfix-public-admin-light .floating-menu .floating-contact .contact-svg,
body.onfix-public-admin-light .floating-menu a .contact-svg{
  fill:currentColor !important;
  color:#111 !important;
}
body.onfix-public-admin-light .floating-menu .floating-contact:hover,
body.onfix-public-admin-light .floating-menu a:hover{
  background:#f3f4f6 !important;
  color:#111 !important;
  border-color:#111 !important;
}
body.onfix-public-admin-light .onfix-chat-fab{
  right:20px !important;
  bottom:20px !important;
  z-index:1605 !important;
  background:#fff !important;
  color:#111 !important;
  border:2px solid #111 !important;
  box-shadow:0 8px 20px rgba(20,24,32,.14) !important;
}
body.onfix-public-admin-light .onfix-chat-panel{
  right:20px !important;
  bottom:86px !important;
}
@media (max-width:560px){
  body.onfix-public-admin-light .floating-actions{
    right:14px !important;
    bottom:76px !important;
  }
  body.onfix-public-admin-light .onfix-chat-fab{
    right:14px !important;
    bottom:14px !important;
  }
  body.onfix-public-admin-light .onfix-chat-panel{
    right:8px !important;
    bottom:76px !important;
  }
}

/* 2026-09-18 — Chat panel opens above Contact button, never behind it */
body.onfix-public-admin-light .onfix-chat-overlay{
  z-index:1690 !important;
}
body.onfix-public-admin-light .onfix-chat-panel{
  right:20px !important;
  bottom:158px !important;
  z-index:1700 !important;
  max-height:calc(100dvh - 178px) !important;
}
body.onfix-public-admin-light .onfix-chat-fab{
  z-index:1650 !important;
}
body.onfix-public-admin-light .floating-actions{
  z-index:1610 !important;
}
body.onfix-public-admin-light .floating-menu{
  z-index:1620 !important;
}
@media (max-width:560px){
  body.onfix-public-admin-light .onfix-chat-panel{
    right:8px !important;
    bottom:140px !important;
    width:calc(100vw - 16px) !important;
    height:min(560px,calc(100dvh - 154px)) !important;
    max-height:calc(100dvh - 154px) !important;
    z-index:1700 !important;
  }
}

/* ONFIX PREMIUM CANVAS FINAL V5 START
   The page canvas changes color.
   Windows, cards, inputs and buttons intentionally remain white.
   This block is deliberately last and uses high-specificity !important rules
   because older ONFIX light-theme files contain broad white-background overrides.
*/
:root{
  --onfix-canvas-warm:#e5e0d7;
  --onfix-canvas-light:#f0ece5;
  --onfix-canvas-sage:#dce3df;
  --onfix-canvas-line:rgba(73,70,61,.14);
  --onfix-window:#ffffff;
  --page:#e5e0d7!important;
}

/* REAL PAGE BACKGROUND */
html{
  min-height:100%;
  background:#e5e0d7!important;
  background-image:
    radial-gradient(circle at 10% -4%,rgba(181,146,65,.16) 0,transparent 30%),
    radial-gradient(circle at 94% 12%,rgba(89,119,107,.12) 0,transparent 31%),
    linear-gradient(145deg,#f0ece5 0%,#e5e0d7 52%,#dce3df 100%)!important;
}

html body,
html body.onfix-public-admin-light,
html body.onfix-catalog-page,
html body.onfix-cart-page{
  min-height:100vh!important;
  background-color:#e5e0d7!important;
  background-image:
    radial-gradient(circle at 10% -4%,rgba(181,146,65,.16) 0,transparent 30%),
    radial-gradient(circle at 94% 12%,rgba(89,119,107,.12) 0,transparent 31%),
    linear-gradient(145deg,#f0ece5 0%,#e5e0d7 52%,#dce3df 100%)!important;
  background-attachment:fixed!important;
  color:#171714!important;
}

/* OLD CSS FORCED THESE LARGE LAYOUT AREAS TO PURE WHITE.
   They are structural areas, not windows, so let the page canvas show through. */
html body > main,
html body main,
html body section,
html body aside,
html body .hero,
html body .section,
html body .section--dark,
html body .stats-section,
html body .cta-section,
html body .video-cta-below-ticker,
html body .catalog-main,
html body .search-main,
html body .seo-main,
html body .reels,
html body .detail,
html body .cart-shell,
html body .order-layout,
html body .order-layout--premium,
html body .order-copy,
html body .order-copy--premium,
html body .split-section,
html body .advantages-text-only{
  background-color:transparent!important;
  background-image:none!important;
}

/* Header/footer belong to the canvas, but remain slightly separated. */
html body header,
html body .site-header,
html body .catalog-header,
html body .search-header,
html body .seo-top,
html body .dashboard-topnav{
  background-color:rgba(239,235,227,.96)!important;
  background-image:
    linear-gradient(180deg,rgba(246,243,237,.98),rgba(230,226,217,.96))!important;
  border-color:var(--onfix-canvas-line)!important;
  box-shadow:0 8px 26px rgba(54,49,39,.06)!important;
  -webkit-backdrop-filter:blur(14px)!important;
  backdrop-filter:blur(14px)!important;
}

html body .site-header .nav-wrap,
html body .site-header .utility-bar,
html body .catalog-nav,
html body .seo-top nav{
  background-color:transparent!important;
  background-image:none!important;
}

html body footer,
html body .site-footer,
html body .customer-footer,
html body .seo-footer,
html body .catalog-footer{
  background-color:rgba(220,221,215,.94)!important;
  background-image:
    linear-gradient(180deg,rgba(229,227,220,.95),rgba(216,220,216,.97))!important;
  border-color:var(--onfix-canvas-line)!important;
}

/* WINDOWS / CARDS STAY WHITE */
html body .panel,
html body .box,
html body .card,
html body .product-card,
html body .catalog-card,
html body .service-card,
html body .video-card,
html body .work-card,
html body .order-card,
html body .order-card--premium,
html body .dashboard-card,
html body .profile-card,
html body .stat-card,
html body .kpi,
html body .table-wrap,
html body .form-card,
html body .sidebar,
html body .topbar,
html body .chat-list,
html body .chat-room,
html body .chat-reply,
html body .dashboard-support-chat,
html body .dashboard-chat-messages,
html body .cart-card,
html body .cart-item,
html body .cart-summary,
html body .cart-panel,
html body .request-card,
html body .search-form,
html body .result-card,
html body .empty,
html body .mainMedia,
html body .info,
html body .catalog-hero,
html body .seo-hero,
html body .seo-card,
html body .model-card,
html body .model-part-card,
html body .brand-page-head,
html body .brand-detail-logo,
html body .brand-grid .brand-button,
html body .services-entry-card,
html body .onfix-commerce-block,
html body .onfix-commerce-card,
html body .onfix-public-review-card,
html body .onfix-public-review-item,
html body .onfix-chat-panel,
html body .auth-card,
html body .auth-container,
html body .verify-box,
html body .login-required-box,
html body .cta-inner,
html body .cta-inner--premium,
html body .video-hub-card,
html body .footer-panel,
html body .footer-location-pro,
html body .footer-location-pro--elegant{
  background-color:#fff!important;
  background-image:none!important;
}

/* Stats are individual windows; the full stats section is not. */
html body .stats-grid article{
  background:#fff!important;
  border:1px solid rgba(25,25,22,.16)!important;
  border-radius:18px!important;
  box-shadow:0 10px 26px rgba(49,44,34,.055)!important;
}

/* Inputs/buttons stay exactly in the light design. */
html body input:not([type="checkbox"]):not([type="radio"]),
html body select,
html body textarea,
html body button,
html body .btn,
html body a.btn,
html body .button,
html body a.button{
  background-color:#fff!important;
}

/* Keep actual media dark where required; it is content, not page background. */
html body video,
html body .repair-process-ad-video{
  background-color:#000!important;
}

/* Mobile uses the same calm tone without fixed-background repaint cost. */
@media(max-width:760px){
  html body,
  html body.onfix-public-admin-light,
  html body.onfix-catalog-page,
  html body.onfix-cart-page{
    background-attachment:scroll!important;
    background-image:
      radial-gradient(circle at 12% 0%,rgba(181,146,65,.13) 0,transparent 29%),
      linear-gradient(155deg,#eeeae3 0%,#e3ded5 56%,#dce2de 100%)!important;
  }
}
/* ONFIX PREMIUM CANVAS FINAL V5 END */

/* ONFIX SHARED CANVAS V6 START
   Fallback for future pages. Current pages also contain the final inline V6 rule
   to avoid cache and CSS-order conflicts. */
html{
  background:#e7ece9!important;
  background-image:
    radial-gradient(circle at 9% -5%,rgba(184,151,77,.105) 0,transparent 29%),
    radial-gradient(circle at 94% 11%,rgba(91,124,114,.10) 0,transparent 31%),
    linear-gradient(145deg,#f3f0e9 0%,#e7ece9 50%,#dce5e1 100%)!important;
}
html body{
  background-color:#e7ece9!important;
  background-image:
    radial-gradient(circle at 9% -5%,rgba(184,151,77,.105) 0,transparent 29%),
    radial-gradient(circle at 94% 11%,rgba(91,124,114,.10) 0,transparent 31%),
    linear-gradient(145deg,#f3f0e9 0%,#e7ece9 50%,#dce5e1 100%)!important;
}
html body main,
html body .catalog-main,
html body .search-main,
html body .seo-main,
html body .reels,
html body .cart-wrap,
html body .dashboard,
html body .detail,
html body .auth-page,
html body.onfix-public-admin-light #main > .hero,
html body .section,
html body .section--dark,
html body .stats-section,
html body .cta-section,
html body .seo-section,
html body .catalog-grid,
html body .cart-list,
html body .customer-kpis,
html body .quick-customer-actions,
html body .brand-models-section,
html body .model-parts-section,
html body .video-cta-below-ticker{
  background-color:transparent!important;
  background-image:none!important;
}
/* ONFIX SHARED CANVAS V6 END */