/*
 * AlahaDeal Phase 2 UI layer
 * Additive visual redesign only. No business logic is changed here.
 */
:root{
  --ad-bg:#f6f8fb;
  --ad-surface:#fff;
  --ad-text:#17202a;
  --ad-muted:#667085;
  --ad-border:#e7ebf0;
  --ad-radius:16px;
  --ad-radius-sm:11px;
  --ad-shadow:0 10px 30px rgba(16,24,40,.08);
  --ad-shadow-hover:0 16px 42px rgba(16,24,40,.14);
  --ad-header-height:72px;
}

html{scroll-behavior:smooth}
body{
  background:var(--ad-bg);
  color:var(--ad-text);
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}

/* Containers and rhythm */
.container{max-width:1320px}
main, .main-content{min-height:50vh}
.section-padding, section{scroll-margin-top:96px}

/* Header */
.header{position:relative;z-index:1030}
.header-top{background:#fff;border-bottom:1px solid var(--ad-border)}
.header-middle{background:#fff}
.header-main{
  background:rgba(255,255,255,.96)!important;
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid rgba(231,235,240,.9);
  box-shadow:0 6px 20px rgba(16,24,40,.05)!important;
}
.header .logo img,.header .system-logo-element{max-height:52px}
.main-nav.nav{gap:2px}
.main-nav.nav>li>a,
.main-nav.nav>a{
  border-radius:10px;
  transition:.2s ease;
}
.main-nav.nav>li>a:hover,
.main-nav.nav>a:hover{background:rgba(var(--bs-primary-rgb),.08);color:var(--bs-primary)}

/* Search */
.search-box{flex:1;max-width:720px}
.search-box>.d-flex,
.search-bar{
  background:#fff;
  border:1px solid #dce2e8;
  border-radius:14px;
  box-shadow:0 3px 12px rgba(16,24,40,.04);
  overflow:hidden;
  transition:.2s ease;
}
.search-box>.d-flex:focus-within,
.search-bar:focus-within{
  border-color:var(--bs-primary);
  box-shadow:0 0 0 4px rgba(var(--bs-primary-rgb),.10);
}
.search-box .form-control,.search-bar .form-control{min-height:48px;background:transparent}
.search-box .btn-primary{border-radius:0 12px 12px 0;min-width:54px}
[dir="rtl"] .search-box .btn-primary{border-radius:12px 0 0 12px}

/* Cards */
.card{
  border:1px solid var(--ad-border);
  border-radius:var(--ad-radius);
  background:var(--ad-surface);
  box-shadow:0 2px 10px rgba(16,24,40,.035);
}
.card:not(.shadow-none){transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.card:not(.shadow-none):hover{border-color:#d8dee6;box-shadow:var(--ad-shadow)}

/* Product surfaces - intentionally broad to cover existing Aster components */
.product-card,
.product-single,
.product-item,
.product-wrapper,
.__product-card,
.product__card{
  border-radius:var(--ad-radius)!important;
  border-color:var(--ad-border)!important;
  overflow:hidden;
  background:#fff;
  transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease;
}
.product-card:hover,
.product-single:hover,
.product-item:hover,
.product-wrapper:hover,
.__product-card:hover,
.product__card:hover{
  transform:translateY(-3px);
  box-shadow:var(--ad-shadow-hover)!important;
  border-color:rgba(var(--bs-primary-rgb),.18)!important;
}
.product-card img,
.product-single img,
.product-item img,
.product-wrapper img{transition:transform .35s ease}
.product-card:hover img,
.product-single:hover img,
.product-item:hover img,
.product-wrapper:hover img{transform:scale(1.025)}
.product__price,.product-price{font-weight:700}
.product__new-price{font-weight:800;color:var(--bs-primary)}
.product__old-price{color:#98a2b3}

/* Buttons */
.btn{
  border-radius:11px;
  font-weight:600;
  transition:transform .16s ease,box-shadow .16s ease,background-color .16s ease,border-color .16s ease;
}
.btn:active{transform:translateY(1px)}
.btn-primary{box-shadow:0 6px 16px rgba(var(--bs-primary-rgb),.18)}
.btn-primary:hover{box-shadow:0 9px 22px rgba(var(--bs-primary-rgb),.27)}
.btn-outline-primary:hover{box-shadow:0 7px 18px rgba(var(--bs-primary-rgb),.14)}

/* Form controls */
.form-control,.form-select,.select2-container--default .select2-selection--single{
  border-radius:11px!important;
  border-color:#d9e0e7!important;
  min-height:44px;
}
.form-control:focus,.form-select:focus{
  border-color:var(--bs-primary)!important;
  box-shadow:0 0 0 4px rgba(var(--bs-primary-rgb),.09)!important;
}
.input-group>.form-control:first-child{border-radius:11px 0 0 11px!important}
.input-group>.btn:last-child{border-radius:0 11px 11px 0!important}

/* Dropdowns / modals */
.dropdown-menu{
  border:1px solid var(--ad-border);
  border-radius:14px;
  box-shadow:var(--ad-shadow);
  padding:8px;
}
.dropdown-item{border-radius:9px;padding:.6rem .75rem}
.dropdown-item:hover{background:rgba(var(--bs-primary-rgb),.07)}
.modal-content{border:0;border-radius:20px;box-shadow:0 25px 70px rgba(16,24,40,.18);overflow:hidden}
.modal-header{border-bottom-color:var(--ad-border)}
.modal-footer{border-top-color:var(--ad-border)}

/* Tables */
.table-responsive{border-radius:var(--ad-radius);background:#fff}
.table>:not(caption)>*>*{padding:.85rem .9rem;border-bottom-color:#edf0f3}
.table thead th{font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;color:#667085;background:#f9fafb}

/* Badges */
.badge{border-radius:999px;font-weight:700;letter-spacing:.01em}

/* Sections and headings */
.section-title,h1,h2,h3{letter-spacing:-.02em}
h1,h2{font-weight:750}
.text-muted{color:var(--ad-muted)!important}

/* Footer */
footer,.footer{background:#fff}
.footer{border-top:1px solid var(--ad-border)}
.footer a{transition:color .18s ease,opacity .18s ease}
.footer a:hover{color:var(--bs-primary)!important}

/* Floating helpers */
.back-to-top{
  border-radius:50%!important;
  box-shadow:0 10px 24px rgba(16,24,40,.16)!important;
}
.social-chat-icons{filter:drop-shadow(0 8px 16px rgba(16,24,40,.16))}

/* Mobile app bar */
.app-bar{
  position:fixed!important;
  left:10px!important;
  right:10px!important;
  bottom:10px!important;
  z-index:1040!important;
}
.app-bar>ul{
  border:1px solid rgba(231,235,240,.9);
  border-radius:18px!important;
  box-shadow:0 14px 38px rgba(16,24,40,.16)!important;
  padding:4px 6px;
  overflow:visible;
}
.app-bar li{flex:1;text-align:center}
.app-bar li>a{min-height:52px;justify-content:center;border-radius:13px;color:#667085;transition:.2s ease}
.app-bar li>a.active,.app-bar li>a:hover{color:var(--bs-primary);background:rgba(var(--bs-primary-rgb),.08)}
.app-bar .count{box-shadow:0 0 0 2px #fff}

/* Mobile header / offcanvas */
.aside{background:#fff;box-shadow:18px 0 45px rgba(16,24,40,.14)}
.aside-body{padding-bottom:90px}

/* Skeleton / loading feel */
.preloader{backdrop-filter:blur(4px)}

/* Accessibility */
a:focus-visible,button:focus-visible,.btn:focus-visible,.form-control:focus-visible{
  outline:3px solid rgba(var(--bs-primary-rgb),.25)!important;
  outline-offset:2px;
}

/* Dark mode alignment */
body[theme="dark"]{
  --ad-bg:#11151a;
  --ad-surface:#171c22;
  --ad-text:#edf2f7;
  --ad-muted:#a0a9b5;
  --ad-border:#28303a;
}
body[theme="dark"] .header-top,
body[theme="dark"] .header-middle,
body[theme="dark"] .header-main,
body[theme="dark"] .card,
body[theme="dark"] .dropdown-menu,
body[theme="dark"] .modal-content,
body[theme="dark"] .app-bar>ul,
body[theme="dark"] .aside{background:var(--ad-surface)!important;border-color:var(--ad-border)!important}
body[theme="dark"] .search-box>.d-flex,
body[theme="dark"] .search-bar{background:var(--ad-surface);border-color:var(--ad-border)}
body[theme="dark"] .form-control,body[theme="dark"] .form-select{background:#151a20;color:var(--ad-text);border-color:var(--ad-border)!important}

@media (max-width:1199.98px){
  body.toolbar-enabled{padding-bottom:82px}
  .header-main{padding:.65rem 0!important}
  .container{padding-left:16px;padding-right:16px}
}
@media (max-width:575.98px){
  :root{--ad-radius:14px}
  .container{padding-left:12px;padding-right:12px}
  .card{border-radius:14px}
  .btn{min-height:42px}
  .app-download-popup{left:12px;right:12px;width:auto!important;border-radius:16px!important;box-shadow:var(--ad-shadow)!important}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}