/* ClickCard Luxury Identity - navy / ivory / gold
   هدف الملف: توحيد الألوان فقط بدون تغيير الربط أو قواعد البيانات أو وظائف JavaScript. */
:root{
  --primary:#173247 !important;
  --secondary:#FBF7EF !important;
  --accent:#B89255 !important;
  --background:#F7F2EA !important;
  --dark:#14283A !important;
  --light-shadow:0 14px 34px rgba(20,40,58,.10) !important;
  --glow-effect:0 0 18px rgba(184,146,85,.40) !important;
  --cc-navy:#173247 !important;
  --cc-navy-2:#0F2435 !important;
  --cc-navy-3:#21435C !important;
  --cc-gold:#B89255 !important;
  --cc-gold-light:#D8BE87 !important;
  --cc-ivory:#F7F2EA !important;
  --cc-ivory-2:#FBF7EF !important;
  --cc-border:#E4D5BF !important;
  --cc-text:#14283A !important;
  --cc-muted:#6E756F !important;
  --as-primary:#173247 !important;
  --as-primary-light:#B89255 !important;
  --as-bg:#F7F2EA !important;
  --as-dark:#14283A !important;
  --us-primary:#173247 !important;
  --us-primary-light:#B89255 !important;
  --us-primary-soft:#F1E7D7 !important;
  --us-bg:#F7F2EA !important;
  --us-surface:#FBF7EF !important;
  --us-border:#E4D5BF !important;
  --us-text:#14283A !important;
  --partner-primary:#173247 !important;
  --partner-secondary:#B89255 !important;
  --ccp-primary:#173247 !important;
  --ccp-accent:#B89255 !important;
  --ccp-bg:#F7F2EA !important;
  --ccp-border:#E4D5BF !important;
}
html,body{background:var(--cc-ivory) !important;color:var(--cc-text) !important;}
body{background-image:radial-gradient(circle at 12% 8%,rgba(216,190,135,.18),transparent 22rem),linear-gradient(180deg,#FBF7EF 0%,#F7F2EA 100%) !important;}
meta[name="theme-color"]{content:#173247 !important;}
a{color:var(--cc-navy) !important;} a:hover{color:var(--cc-gold) !important;}
/* Headers */
header,.site-header,.main-header,.topbar,.navbar,.header,.admin-shell-header,.user-shell-header{
  background:linear-gradient(135deg,var(--cc-navy-2) 0%,var(--cc-navy) 64%,var(--cc-navy-3) 100%) !important;
  color:#fff !important;border-bottom:1px solid rgba(216,190,135,.38) !important;box-shadow:0 10px 30px rgba(15,36,53,.16) !important;
}
header a,.site-header a,.main-header a,.navbar a,.admin-shell-header a,.user-shell-header a,.nav-link,.main-nav a{color:#fff !important;}
.nav-link:hover,.main-nav a:hover,header a:hover,.site-header a:hover{background:rgba(184,146,85,.18) !important;color:#fff !important;}
.nav-link.active,.main-nav a.active{background:rgba(184,146,85,.26) !important;color:#fff !important;}
.logo-text,.logo,.brand,.admin-shell-brand,.user-shell-brand{color:#fff !important;}
/* Hero */
.hero,.page-hero,.hero-section,.admin-shell-page-hero,.dashboard-hero{
  background:radial-gradient(circle at 15% 15%,rgba(216,190,135,.38),transparent 16rem),linear-gradient(135deg,rgba(15,36,53,.92),rgba(23,50,71,.86)) !important;
  color:#fff !important;border-color:rgba(216,190,135,.32) !important;
}
.hero::before{background:linear-gradient(135deg,rgba(15,36,53,.82),rgba(184,146,85,.44)) !important;}
.hero h1,.hero p,.page-hero h1,.page-hero p,.admin-shell-page-hero h1,.admin-shell-page-hero p{color:#fff !important;}
.wave .shape-fill,.wave-container .shape-fill{fill:var(--cc-ivory) !important;}
/* Buttons */
.btn,button[type="submit"],.btn-primary,.primary-btn,.action-btn,.submit-btn,.send-btn,.back-to-top,.chat-assistant-toggle,.admin-shell-page-hero .hero-actions a{
  background:linear-gradient(135deg,var(--cc-navy),var(--cc-gold)) !important;color:#fff !important;border-color:rgba(184,146,85,.45) !important;box-shadow:0 10px 24px rgba(20,40,58,.18) !important;
}
.btn:hover,button[type="submit"]:hover,.btn-primary:hover,.primary-btn:hover,.action-btn:hover,.submit-btn:hover,.send-btn:hover,.back-to-top:hover{
  background:linear-gradient(135deg,var(--cc-gold),var(--cc-navy)) !important;color:#fff !important;box-shadow:0 14px 30px rgba(184,146,85,.24) !important;
}
.btn-login,.btn.secondary,.btn-outline,.secondary-btn{background:var(--cc-ivory-2) !important;color:var(--cc-navy) !important;border:1px solid var(--cc-gold) !important;}
/* Cards and sections */
.features,.showcase,main,.main-content,.content-wrapper,.dashboard,.admin-container,.page-wrapper{background:transparent !important;}
.feature,.card-sample,.card,.panel,.box,.container-card,.stat-card,.pricing-card,.template-card,.invitation-card,.form-card,.login-container,.register-container,section:not(.hero):not(.features):not(.showcase) .card{
  background:rgba(251,247,239,.96) !important;border-color:var(--cc-border) !important;box-shadow:0 14px 36px rgba(20,40,58,.08) !important;color:var(--cc-text) !important;
}
.feature{border-top-color:var(--cc-gold) !important;}
.feature::before,.card-sample::before{background:linear-gradient(135deg,var(--cc-navy),var(--cc-gold)) !important;}
.feature:hover,.card-sample:hover{box-shadow:0 18px 42px rgba(20,40,58,.16) !important;}
.section-title,h1,h2,h3,.title,.page-title{color:var(--cc-navy) !important;}
.section-title::after{background:var(--cc-gold) !important;}
.feature i,.icon,.fas,.far,.fab{color:inherit;}
.feature > i,.section-icon,.card-icon{color:var(--cc-gold) !important;}
.feature:hover i,.feature:hover h3,.feature:hover p{color:#fff !important;}
p,.small,.muted,.subtitle,.description{color:var(--cc-muted) !important;}
.hero p,.hero .small,.hero .muted,footer p,footer a,footer li{color:rgba(255,255,255,.88) !important;}
/* Inputs and tables */
input,select,textarea{background:#fffdfa !important;border-color:var(--cc-border) !important;color:var(--cc-text) !important;}
input:focus,select:focus,textarea:focus{border-color:var(--cc-gold) !important;box-shadow:0 0 0 4px rgba(184,146,85,.16) !important;outline:none !important;}
table,thead,tbody,tr,td,th{border-color:var(--cc-border) !important;} th{background:#F1E7D7 !important;color:var(--cc-navy) !important;}
/* Public footer */
footer,.site-footer,.main-footer,#footer-container footer,.user-footer,.admin-shell-footer,.user-shell-footer{
  background:linear-gradient(135deg,var(--cc-navy-2) 0%,var(--cc-navy) 62%,var(--cc-navy-3) 100%) !important;color:#fff !important;border-top:1px solid rgba(216,190,135,.34) !important;
}
footer h3,.site-footer h3,.footer-column h3{color:#fff !important;} footer h3::after,.footer-column h3::after{background:var(--cc-gold) !important;}
.social-links a,footer .social a{background:rgba(184,146,85,.18) !important;color:#fff !important;border:1px solid rgba(216,190,135,.28) !important;}
.social-links a:hover{background:var(--cc-gold) !important;color:var(--cc-navy) !important;}
/* Sidebars / drawers: مثل جانبية الصورة */
.sidebar,.side-menu,.mobile-menu,.cc-mobile-drawer,.admin-shell-sidebar,.user-shell-sidebar,#sidebar,#ccMobileDrawer{
  background:radial-gradient(circle at 50% 0%,rgba(216,190,135,.28),transparent 13rem),linear-gradient(180deg,var(--cc-navy-2) 0%,var(--cc-navy) 55%,var(--cc-navy-3) 100%) !important;
  color:#fff !important;border-left:1px solid rgba(216,190,135,.45) !important;box-shadow:-12px 0 36px rgba(15,36,53,.26) !important;
}
.sidebar *,.side-menu *,.mobile-menu *,.cc-mobile-drawer *,.admin-shell-sidebar *,.user-shell-sidebar *,#sidebar *{color:inherit !important;}
.sidebar a,.side-menu a,.mobile-menu a,.cc-mobile-drawer a,.admin-shell-sidebar a,.user-shell-sidebar a,#sidebar a,
.sidebar button,.cc-mobile-drawer button,.admin-shell-section-toggle,.user-shell-section-toggle{
  color:#fff !important;background:rgba(255,255,255,.04) !important;border:1px solid rgba(216,190,135,.16) !important;border-radius:14px !important;
}
.sidebar a:hover,.side-menu a:hover,.mobile-menu a:hover,.cc-mobile-drawer a:hover,.admin-shell-sidebar a:hover,.user-shell-sidebar a:hover,#sidebar a:hover,
.admin-shell-section-toggle:hover,.user-shell-section-toggle:hover{
  background:rgba(184,146,85,.22) !important;color:#fff !important;border-color:rgba(216,190,135,.42) !important;transform:translateX(-3px);
}
.admin-shell-section.open > .admin-shell-section-toggle,.user-shell-section.open > .user-shell-section-toggle,.cc-mobile-drawer .active,.sidebar .active{background:rgba(184,146,85,.30) !important;border-color:rgba(216,190,135,.55) !important;}
.user-shell-sidebar .profile,.admin-shell-brand,.cc-mobile-drawer .cc-mobile-drawer-head{
  background:rgba(251,247,239,.10) !important;border:1px solid rgba(216,190,135,.32) !important;border-radius:20px !important;
}
.user-shell-sidebar .profile .avatar,.admin-shell-title .icon{background:linear-gradient(135deg,var(--cc-gold),var(--cc-navy)) !important;color:#fff !important;}
.close-sidebar,.menu-toggle,.admin-shell-toggle,.user-shell-toggle{background:rgba(184,146,85,.18) !important;color:#fff !important;border-color:rgba(216,190,135,.35) !important;}
.overlay,.sidebar-overlay,.admin-shell-overlay,.user-shell-overlay{background:rgba(15,36,53,.58) !important;}
/* Assistant/chat */
.chat-window{background:var(--cc-ivory-2) !important;border:1px solid var(--cc-border) !important;}
.chat-header{background:linear-gradient(135deg,var(--cc-navy),var(--cc-gold)) !important;color:#fff !important;}
.chat-messages{background:#F3ECE0 !important;}
/* Decorative details */
::-webkit-scrollbar-track{background:var(--cc-ivory) !important;}::-webkit-scrollbar-thumb{background:var(--cc-navy) !important;border:2px solid var(--cc-ivory) !important;}
::selection{background:var(--cc-gold) !important;color:var(--cc-navy) !important;}
.glow{text-shadow:0 0 10px rgba(216,190,135,.50),0 0 28px rgba(184,146,85,.45) !important;}
.star{background:var(--cc-gold-light) !important;}

/* === ClickCard unified visual identity final pass - 2026-05-12 ===
   يثبت الهوية الكحلية/الذهبية على كل الصفحات، القوائم، الهيدر، البطل، ولوحات المستخدم/الإدارة. */
:root{
  --cc-deep:#0F2435 !important;
  --cc-navy:#173247 !important;
  --cc-slate:#21435C !important;
  --cc-gold:#B89255 !important;
  --cc-gold-soft:#D8BE87 !important;
  --cc-cream:#F7F2EA !important;
  --cc-cream-2:#FBF7EF !important;
  --cc-line:rgba(216,190,135,.34) !important;
  --cc-white:#FFFFFF !important;
}
html,body{background:linear-gradient(180deg,var(--cc-cream-2),var(--cc-cream)) !important;color:#14283A !important;scrollbar-color:var(--cc-deep) var(--cc-cream) !important;}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(circle at 12% 6%,rgba(216,190,135,.18),transparent 24rem),radial-gradient(circle at 86% 0%,rgba(23,50,71,.10),transparent 22rem) !important;}
/* remove public header top gaps and force same elegant navbar */
body > header, header, .site-header, .main-header, .navbar, #header-container header{
  margin-top:0 !important;top:0 !important;min-height:98px !important;padding:1rem 2.2rem !important;border-radius:0 0 26px 26px !important;
  background:linear-gradient(135deg,var(--cc-deep) 0%,var(--cc-navy) 62%,var(--cc-slate) 100%) !important;
  border-bottom:1px solid var(--cc-line) !important;box-shadow:0 18px 42px rgba(15,36,53,.20) !important;color:#fff !important;
}
body > header::before, header::before, .site-header::before, .main-header::before{background:none !important;display:none !important;}
nav, .main-nav, .nav-menu, .navbar-nav{align-items:center !important;gap:.55rem !important;}
nav a, .main-nav a, .nav-link, .navbar a{color:#fff !important;border:1px solid transparent !important;border-radius:999px !important;padding:.62rem 1rem !important;text-shadow:none !important;}
nav a:hover, .main-nav a:hover, .nav-link:hover, .navbar a:hover, nav a.active, .main-nav a.active, .nav-link.active{
  background:rgba(184,146,85,.18) !important;border-color:rgba(216,190,135,.35) !important;color:#fff !important;transform:translateY(-1px) !important;
}
.logo-container,.brand,.logo{filter:none !important}.logo-text,.brand-title{color:#fff !important;text-shadow:0 8px 24px rgba(0,0,0,.24) !important;}
/* dropdowns: no more unreadable white menu */
.dropdown-menu,.submenu,.nav-dropdown,.menu-dropdown,.dropdown-content,nav ul ul,.main-nav ul ul,
.header-dropdown,.dropdown .dropdown-menu,.dropdown:hover .dropdown-menu{
  background:linear-gradient(180deg,rgba(15,36,53,.98),rgba(23,50,71,.96)) !important;color:#fff !important;
  border:1px solid rgba(216,190,135,.38) !important;border-radius:22px !important;box-shadow:0 20px 52px rgba(15,36,53,.32) !important;
  backdrop-filter:blur(18px) saturate(145%) !important;-webkit-backdrop-filter:blur(18px) saturate(145%) !important;overflow:hidden !important;
}
.dropdown-menu a,.submenu a,.nav-dropdown a,.menu-dropdown a,.dropdown-content a,nav ul ul a,.main-nav ul ul a{
  color:#fff !important;background:transparent !important;border-color:rgba(216,190,135,.10) !important;border-radius:14px !important;margin:.28rem !important;font-weight:800 !important;
}
.dropdown-menu a:hover,.submenu a:hover,.nav-dropdown a:hover,.menu-dropdown a:hover,.dropdown-content a:hover,nav ul ul a:hover,.main-nav ul ul a:hover{
  background:rgba(184,146,85,.26) !important;color:#fff !important;border-color:rgba(216,190,135,.36) !important;
}
/* hero sections consistent with final screenshot */
.hero,.hero-section,.page-hero,.dashboard-hero,.admin-shell-page-hero,.user-hero,.welcome-section,.welcome-card,
body.user-shell-active .hero, body.user-shell-active .dashboard-hero, body.user-shell-active .welcome-section{
  color:#fff !important;overflow:hidden !important;position:relative !important;border:1px solid rgba(216,190,135,.30) !important;border-radius:26px !important;
  background:radial-gradient(circle at 18% 18%,rgba(216,190,135,.28),transparent 18rem),linear-gradient(135deg,rgba(15,36,53,.96) 0%,rgba(23,50,71,.93) 58%,rgba(33,67,92,.86) 100%) !important;
  box-shadow:0 18px 45px rgba(15,36,53,.18) !important;
}
.hero{min-height:560px !important;padding-top:8.5rem !important;}
.hero::before,.hero-section::before,.page-hero::before,.dashboard-hero::before,.admin-shell-page-hero::before,.welcome-section::before,.welcome-card::before{
  content:"" !important;position:absolute !important;inset:0 !important;background:linear-gradient(135deg,rgba(15,36,53,.38),rgba(184,146,85,.16)) !important;pointer-events:none !important;z-index:0 !important;
}
.hero > *,.hero-section > *,.page-hero > *,.dashboard-hero > *,.admin-shell-page-hero > *,.welcome-section > *,.welcome-card > *{position:relative !important;z-index:1 !important;}
.hero h1,.hero h2,.hero p,.hero-section h1,.hero-section p,.page-hero h1,.page-hero p,.dashboard-hero h1,.dashboard-hero p,.admin-shell-page-hero h1,.admin-shell-page-hero p,.welcome-section h1,.welcome-section p,.welcome-card h1,.welcome-card p{color:#fff !important;text-shadow:0 8px 26px rgba(0,0,0,.24) !important;}
.hero h1,.page-hero h1,.dashboard-hero h1,.admin-shell-page-hero h1{font-weight:900 !important;letter-spacing:-.02em !important;}
/* shell headers and sidebars */
body.user-shell-active .user-shell-header, body.admin-shell-active .admin-shell-header{
  background:rgba(251,247,239,.96) !important;color:var(--cc-deep) !important;border-bottom:1px solid rgba(216,190,135,.32) !important;box-shadow:0 12px 34px rgba(15,36,53,.12) !important;
  backdrop-filter:blur(18px) saturate(150%) !important;-webkit-backdrop-filter:blur(18px) saturate(150%) !important;
}
body.user-shell-active .user-shell-brand strong, body.user-shell-active .user-shell-greeting, body.admin-shell-active .admin-shell-title strong{color:var(--cc-deep) !important;}
body.user-shell-active .user-shell-brand span, body.user-shell-active .user-shell-greeting small{color:#536372 !important;}
body.user-shell-active .user-shell-toggle, body.user-shell-active .user-shell-notify, body.user-shell-active .user-shell-avatar,
body.admin-shell-active .admin-shell-toggle, body.admin-shell-active .admin-shell-logout, body.admin-shell-active .admin-shell-avatar{
  background:linear-gradient(135deg,var(--cc-deep),var(--cc-navy)) !important;color:#fff !important;border:1px solid rgba(216,190,135,.26) !important;box-shadow:0 10px 26px rgba(15,36,53,.18) !important;
}
body.user-shell-active .user-shell-sidebar, body.admin-shell-active .admin-shell-sidebar, .sidebar, .side-menu, .mobile-menu, .cc-mobile-drawer, #sidebar, #ccMobileDrawer{
  background:radial-gradient(circle at 50% 0%,rgba(216,190,135,.30),transparent 14rem),linear-gradient(180deg,var(--cc-deep) 0%,var(--cc-navy) 58%,var(--cc-slate) 100%) !important;
  color:#fff !important;border-left:1px solid rgba(216,190,135,.45) !important;box-shadow:-18px 0 44px rgba(15,36,53,.26) !important;
}
body.user-shell-active .user-shell-sidebar *, body.admin-shell-active .admin-shell-sidebar *, .sidebar *, .side-menu *, .mobile-menu *, .cc-mobile-drawer *, #sidebar *{color:inherit !important;}
body.user-shell-active .user-shell-section, body.admin-shell-active .admin-shell-section{background:rgba(255,255,255,.055) !important;border:1px solid rgba(216,190,135,.18) !important;border-radius:18px !important;}
body.user-shell-active .user-shell-section-toggle, body.admin-shell-active .admin-shell-section-toggle,
body.user-shell-active .user-shell-link, body.admin-shell-active .admin-shell-link, .sidebar a, .side-menu a, .mobile-menu a, .cc-mobile-drawer a{
  color:#fff !important;background:rgba(255,255,255,.045) !important;border:1px solid rgba(216,190,135,.14) !important;border-radius:15px !important;text-decoration:none !important;
}
body.user-shell-active .user-shell-section.open > .user-shell-section-toggle, body.admin-shell-active .admin-shell-section.open > .admin-shell-section-toggle,
body.user-shell-active .user-shell-link.active, body.admin-shell-active .admin-shell-link.active, .sidebar .active, .cc-mobile-drawer .active{
  background:linear-gradient(135deg,rgba(184,146,85,.42),rgba(216,190,135,.24)) !important;border-color:rgba(216,190,135,.58) !important;color:#fff !important;font-weight:900 !important;
}
body.user-shell-active .user-shell-link:hover, body.admin-shell-active .admin-shell-link:hover, .sidebar a:hover, .side-menu a:hover, .mobile-menu a:hover, .cc-mobile-drawer a:hover{
  background:rgba(184,146,85,.26) !important;border-color:rgba(216,190,135,.48) !important;color:#fff !important;transform:translateX(-3px) !important;
}
body.user-shell-active .user-shell-sidebar .profile, body.admin-shell-active .admin-shell-brand, .cc-mobile-drawer .cc-mobile-drawer-head{
  background:rgba(251,247,239,.10) !important;border:1px solid rgba(216,190,135,.34) !important;border-radius:22px !important;color:#fff !important;
}
body.user-shell-active .user-shell-sidebar .profile .avatar{background:linear-gradient(135deg,var(--cc-gold),var(--cc-deep)) !important;color:#fff !important;}
body.user-shell-active .user-shell-badge{background:var(--cc-gold) !important;color:var(--cc-deep) !important;}
/* sections/cards clean ivory look */
.card,.panel,.box,.stat-card,.metric-card,.template-card,.pricing-card,.order-card,.form-card,.login-container,.register-container,.table-container,.content-card,.dashboard-card{
  background:rgba(251,247,239,.96) !important;border:1px solid rgba(216,190,135,.28) !important;border-radius:22px !important;box-shadow:0 16px 38px rgba(15,36,53,.08) !important;color:#14283A !important;
}
.card:hover,.template-card:hover,.pricing-card:hover,.stat-card:hover{box-shadow:0 20px 48px rgba(15,36,53,.14) !important;}
h1,h2,h3,h4,.section-title,.page-title,.card-title{color:var(--cc-deep) !important;}
.hero h1,.hero h2,.hero h3,.page-hero h1,.page-hero h2,.dashboard-hero h1,.dashboard-hero h2,.admin-shell-page-hero h1,.admin-shell-page-hero h2,.welcome-section h1,.welcome-section h2{color:#fff !important;}
.section-title::after,.title-underline,.divider-gold{background:var(--cc-gold) !important;border-color:var(--cc-gold) !important;}
.btn,.button,button[type="submit"],.btn-primary,.primary-btn,.action-btn,.cta-button,.hero .btn,.hero a.btn,.admin-shell-page-hero .hero-actions a{
  background:linear-gradient(135deg,var(--cc-navy),var(--cc-gold)) !important;color:#fff !important;border:1px solid rgba(216,190,135,.42) !important;border-radius:999px !important;box-shadow:0 12px 28px rgba(15,36,53,.18) !important;font-weight:900 !important;
}
.btn:hover,.button:hover,button[type="submit"]:hover,.btn-primary:hover,.primary-btn:hover,.action-btn:hover,.cta-button:hover{background:linear-gradient(135deg,var(--cc-gold),var(--cc-navy)) !important;color:#fff !important;transform:translateY(-2px) !important;}
input,select,textarea{background:#fffdfa !important;color:#14283A !important;border:1px solid rgba(216,190,135,.34) !important;border-radius:14px !important;}
input:focus,select:focus,textarea:focus{border-color:var(--cc-gold) !important;box-shadow:0 0 0 4px rgba(184,146,85,.16) !important;outline:none !important;}
@media (max-width: 768px){
  body > header, header, .site-header, .main-header, .navbar, #header-container header{min-height:auto !important;padding:.8rem 1rem !important;border-radius:0 0 20px 20px !important;}
  .hero{min-height:520px !important;padding:7rem 1.2rem 4rem !important;border-radius:0 0 26px 26px !important;}
  .hero h1{font-size:clamp(2.3rem,11vw,4rem) !important;}
}