/*
 * WHAPIDE · TARJIX BLUE DESIGN SYSTEM
 * Visual language intentionally mirrors the approved TARJIX system:
 * warm white surfaces, pastel interface backgrounds, soft depth, compact
 * navigation, dense but calm forms/tables, rounded cards and clear hierarchy.
 * Whapide replaces TARJIX lavender/violet with blue.
 */

:root{
  --wb-deep:#173b73;
  --wb-primary:#2f6fed;
  --wb-primary-strong:#255dce;
  --wb-primary-soft:#e8f1ff;
  --wb-primary-softer:#f4f8ff;
  --wb-white:#fcfdff;
  --wb-ink:#17243a;
  --wb-muted:#7e8ba1;
  --wb-line:#d9e5f5;
  --wb-line-strong:#cbdaf0;
  --wb-success:#42b98a;
  --wb-success-soft:#e4f6ef;
  --wb-danger:#d96b70;
  --wb-danger-soft:#fcebec;
  --wb-amber:#c99532;
  --wb-amber-soft:#fff3de;
  --wb-info:#6674d9;
  --wb-info-soft:#eaedff;
  --wb-shadow-xs:0 1px 2px rgba(23,59,115,.035);
  --wb-shadow-sm:0 8px 24px rgba(23,59,115,.055);
  --wb-shadow-md:0 18px 48px rgba(23,59,115,.075);
  --wb-shadow-lg:0 30px 90px rgba(23,59,115,.14);
  --wb-radius-sm:12px;
  --wb-radius:18px;
  --wb-radius-lg:24px;

  /* legacy aliases used throughout Whapide */
  --w-bg:var(--wb-primary-softer);
  --w-panel:var(--wb-white);
  --w-line:var(--wb-line);
  --w-text:var(--wb-ink);
  --w-muted:var(--wb-muted);
  --w-brand:var(--wb-primary);
  --w-brand2:var(--wb-deep);
  --w-soft:var(--wb-primary-soft);
  --w-danger:var(--wb-danger);
  --w-warn:var(--wb-amber);
  --w-shadow:var(--wb-shadow-sm);
  --w-radius:var(--wb-radius);
}

html{background:var(--wb-primary-softer)}
body.whapide-body{
  margin:0;
  background:
    radial-gradient(circle at 86% 8%,rgba(47,111,237,.08),transparent 23%),
    radial-gradient(circle at 8% 38%,rgba(102,116,217,.045),transparent 25%),
    linear-gradient(180deg,#f8fbff 0%,var(--wb-primary-softer) 52%,#f1f6ff 100%)!important;
  color:var(--wb-ink)!important;
  font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body.whapide-body *{box-sizing:border-box}
body.whapide-body ::selection{background:#dbe8ff;color:#173b73}
body.whapide-body h1,body.whapide-body h2,body.whapide-body h3,body.whapide-body h4{color:var(--wb-deep)!important;letter-spacing:-.03em}
body.whapide-body p{line-height:1.55}
body.whapide-body a{color:inherit}

/* Brand */
.w-logo{gap:10px!important;color:var(--wb-deep)!important;font-weight:800!important;letter-spacing:-.03em!important}
.w-logo span,.w-logo .w-mark{
  background:linear-gradient(145deg,#376fdc 0%,#2f6fed 55%,#79a4ff 100%)!important;
  color:#fff!important;
  border:1px solid rgba(255,255,255,.45)!important;
  box-shadow:0 9px 24px rgba(47,111,237,.22),inset 0 1px 0 rgba(255,255,255,.32)!important;
}
.w-logo b>span{background:none!important;border:0!important;box-shadow:none!important;color:var(--wb-primary)!important;width:auto!important;height:auto!important;border-radius:0!important}

/* Buttons */
.w-btn{
  min-height:42px!important;
  padding:9px 14px!important;
  border:1px solid var(--wb-line-strong)!important;
  border-radius:12px!important;
  background:rgba(252,253,255,.96)!important;
  color:#3a4963!important;
  font-size:13px!important;
  font-weight:720!important;
  letter-spacing:-.01em!important;
  box-shadow:var(--wb-shadow-xs)!important;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease,color .16s ease!important;
}
.w-btn:hover{transform:translateY(-1px);border-color:#b9cceb!important;background:#fff!important;box-shadow:0 8px 22px rgba(23,59,115,.08)!important}
.w-btn:active{transform:translateY(0)}
.w-btn:focus-visible{outline:3px solid rgba(47,111,237,.16)!important;outline-offset:2px}
.w-btn-primary,.w-btn-create{
  background:linear-gradient(180deg,#3778f1 0%,var(--wb-primary) 100%)!important;
  border-color:var(--wb-primary)!important;
  color:#fff!important;
  box-shadow:0 10px 22px rgba(47,111,237,.19)!important;
}
.w-btn-primary:hover,.w-btn-create:hover{background:linear-gradient(180deg,#316fe7,#255fd4)!important;border-color:#255fd4!important;color:#fff!important;box-shadow:0 13px 28px rgba(47,111,237,.24)!important}
.w-btn-primary:visited,.w-btn-create:visited{color:#fff!important}
.w-btn-danger{background:#fff!important;border-color:#efc7ca!important;color:#b64c52!important}
.w-btn-danger:hover{background:var(--wb-danger-soft)!important;border-color:#e5a9ae!important;color:#984147!important}
.w-btn-whatsapp{background:linear-gradient(180deg,#4cc493,#3aae82)!important;border-color:#3aae82!important;color:#fff!important}
.w-btn-sm{min-height:35px!important;padding:7px 11px!important;border-radius:10px!important;font-size:12px!important}
.w-icon-btn{border:1px solid var(--wb-line)!important;background:var(--wb-white)!important;color:#667794!important;border-radius:11px!important;box-shadow:var(--wb-shadow-xs)!important}
.w-icon-btn:hover{border-color:#bfcfea!important;background:#fff!important;color:var(--wb-primary)!important}

/* Inputs */
.w-input,.w-select,.w-textarea{
  min-height:44px!important;
  padding:10px 13px!important;
  border:1px solid var(--wb-line)!important;
  border-radius:12px!important;
  background:#fffefe!important;
  color:var(--wb-ink)!important;
  box-shadow:inset 0 1px 0 rgba(23,59,115,.012),var(--wb-shadow-xs)!important;
}
.w-input:hover,.w-select:hover,.w-textarea:hover{border-color:#c4d5ec!important}
.w-input:focus,.w-select:focus,.w-textarea:focus{border-color:#8fb2f5!important;box-shadow:0 0 0 4px rgba(47,111,237,.09)!important;outline:0!important}
.w-input::placeholder,.w-textarea::placeholder{color:#99a6b8!important}
.w-form-grid>label,.w-card label{color:#53627a!important;font-size:12px!important;font-weight:680!important}
.w-check{color:#596780!important;font-weight:620!important}
.w-check input{accent-color:var(--wb-primary)!important}

/* Shared surfaces */
.w-card,.w-info-card,.w-chart-card,.w-table-card,.w-order-modal,.w-product-editor{
  background:rgba(252,253,255,.98)!important;
  border:1px solid var(--wb-line)!important;
  border-radius:20px!important;
  box-shadow:0 1px 2px rgba(23,59,115,.025),0 10px 30px rgba(23,59,115,.045)!important;
}
.w-pad{padding:22px!important}
.w-alert{border:1px solid #cbdcf6!important;border-radius:14px!important;background:#eef5ff!important;color:#31578b!important}
.w-alert-danger{border-color:#f2c9cd!important;background:#fff4f5!important;color:#98454d!important}
.w-badge{border-radius:999px!important;font-size:11px!important;font-weight:760!important;padding:5px 9px!important}
.w-badge.green{background:var(--wb-success-soft)!important;color:#2e8e6b!important}
.w-badge.blue{background:var(--wb-primary-soft)!important;color:#2f64ca!important}
.w-badge.orange{background:var(--wb-amber-soft)!important;color:#9a7424!important}
.w-badge.gray{background:#f0f3f8!important;color:#758198!important}

/* App shell — mirrors TARJIX Business / MiAdmin */
.w-top{
  height:72px!important;
  padding:0 24px!important;
  background:rgba(252,253,255,.94)!important;
  border-bottom:1px solid rgba(217,229,245,.96)!important;
  backdrop-filter:blur(18px)!important;
  box-shadow:0 1px 0 rgba(23,59,115,.02)!important;
}
.w-top:after{background:linear-gradient(90deg,transparent,rgba(47,111,237,.16),transparent)!important}
.w-top-context{color:#66738b!important}
.w-top-context strong,.w-top-context b{color:var(--wb-deep)!important}
.w-top-kicker{color:#9aa5b5!important;font-size:9px!important;letter-spacing:.13em!important;font-weight:800!important}
.w-top-divider{background:var(--wb-line)!important}
.w-role{background:var(--wb-primary-soft)!important;color:#315fbd!important;border:1px solid #d6e4fb!important;border-radius:999px!important;font-size:10px!important;font-weight:760!important}
.w-user{border-radius:14px!important}
.w-user b{color:#36445c!important;font-size:12px!important}
.w-user small{color:#9aa5b6!important}
.w-avatar{background:linear-gradient(145deg,#edf4ff,#dce9ff)!important;color:#2f64ca!important;border:1px solid #d0dff6!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.8)!important}
.w-shell{grid-template-columns:252px minmax(0,1fr)!important;min-height:calc(100vh - 72px)!important}
.w-side{
  top:72px!important;height:calc(100vh - 72px)!important;
  padding:17px 13px 24px!important;
  background:rgba(252,253,255,.9)!important;
  border-right:1px solid rgba(217,229,245,.98)!important;
  backdrop-filter:blur(16px)!important;
}
.w-side-title{padding:7px 12px 12px!important;color:#9ba6b7!important;font-size:9px!important;font-weight:820!important;letter-spacing:.13em!important}
.w-nav{
  min-height:43px!important;padding:10px 12px!important;margin:3px 0!important;border:1px solid transparent!important;border-radius:12px!important;
  color:#56657e!important;font-size:13px!important;font-weight:630!important;transition:.15s ease!important;
}
.w-nav>span{color:#8090a9!important}
.w-nav:hover{background:#f2f6fd!important;color:#315a9d!important;border-color:#e8f0fb!important;transform:translateX(1px)!important}
.w-nav.active{
  background:linear-gradient(90deg,#eaf2ff,#f5f8ff)!important;
  color:#285bbf!important;border-color:#dbe7fa!important;font-weight:760!important;
  box-shadow:inset 3px 0 0 var(--wb-primary)!important;
}
.w-nav.active>span{color:var(--wb-primary)!important}
.w-back{color:#7b889f!important;font-size:12px!important;font-weight:650!important}
.w-back:hover{color:var(--wb-primary)!important}
.w-merchant-mini{padding:9px 6px 18px!important;border-bottom:1px solid #edf2f9!important;margin-bottom:12px!important}
.w-merchant-mini b{color:#34445d!important;font-size:13px!important}
.w-merchant-mini small{color:#95a0b2!important;font-size:10px!important}
.w-main{padding:30px 32px 48px!important;max-width:1540px!important}
.w-page-head{align-items:center!important;margin-bottom:22px!important}
.w-page-head h1{margin:0 0 5px!important;color:var(--wb-deep)!important;font-size:29px!important;line-height:1.12!important;font-weight:810!important}
.w-page-head p{margin:0!important;color:#8793a7!important;font-size:13px!important}
.w-subhead{padding-bottom:14px!important;border-bottom:1px solid var(--wb-line)!important;margin-bottom:20px!important}
.w-subhead h2{font-size:21px!important;font-weight:780!important}

/* Directory */
.w-directory-hero{
  position:relative!important;overflow:hidden!important;
  border:1px solid #cfddf4!important;border-radius:24px!important;
  background:
    radial-gradient(circle at 84% 18%,rgba(255,255,255,.28),transparent 24%),
    linear-gradient(135deg,#244d94 0%,#2f6fed 52%,#7ca6f7 100%)!important;
  color:#fff!important;box-shadow:0 20px 55px rgba(47,111,237,.16)!important;
}
.w-directory-hero h1,.w-directory-hero h2,.w-directory-hero h3,.w-directory-hero p,.w-directory-hero small{color:#fff!important}
.w-directory-hero .w-btn{background:#fff!important;color:#285dc4!important;border-color:#fff!important}
.w-directory-tools{gap:14px!important;margin:14px 0 20px!important}
.w-directory-tools .w-input{max-width:440px!important;background:rgba(255,255,255,.96)!important}
.w-count{color:#93a0b3!important;font-weight:650!important}
.w-planbar{background:linear-gradient(100deg,#edf4ff,#f8fbff)!important;border:1px solid #d6e4f8!important;border-radius:17px!important;box-shadow:var(--wb-shadow-xs)!important}
.w-planbar b{color:#315a9d!important}
.w-progress{background:#dfe9f8!important}
.w-progress i{background:linear-gradient(90deg,#2f6fed,#75a0f5)!important}
.w-merchant-grid{gap:18px!important}
.w-merchant-card{
  padding:19px!important;border:1px solid #e0e8f4!important;border-radius:20px!important;background:var(--wb-white)!important;
  box-shadow:0 2px 8px rgba(23,59,115,.025),0 12px 30px rgba(23,59,115,.045)!important;
}
.w-merchant-card:hover{transform:translateY(-2px)!important;border-color:#ccd9ee!important;box-shadow:0 20px 46px rgba(23,59,115,.08)!important}
.w-merchant-card h3{color:#283a57!important;font-size:17px!important;font-weight:780!important}
.w-merchant-card p{color:#8c98aa!important;font-size:11px!important}
.w-merchant-card footer{background:#f9fbff!important;border-top:1px solid #edf2f9!important;color:#8f9bae!important;font-size:10px!important}
.w-merchant-logo{border:1px solid #e9eef7!important;box-shadow:0 7px 20px rgba(23,59,115,.08)!important}
.w-logo-fallback{background:linear-gradient(145deg,#315fbd,#2f6fed 60%,#80a9f8)!important;color:#fff!important}
.w-status-dot{box-shadow:0 0 0 4px #fff!important}.w-status-dot.ok{background:var(--wb-success)!important}
.w-business-types span{background:#fbfdff!important;border:1px solid #e0e8f4!important;border-radius:16px!important;color:#4b5b74!important}
.w-business-types span:hover{border-color:#c8d9f1!important;box-shadow:0 9px 20px rgba(23,59,115,.05)!important}
.w-business-types input:checked+span{border-color:#8eb1f3!important;background:#eef4ff!important;box-shadow:0 0 0 3px rgba(47,111,237,.08)!important}

/* Tabs */
.w-tabs{gap:4px!important;margin-bottom:20px!important;border-bottom:1px solid var(--wb-line)!important}
.w-tabs button{padding:10px 13px 12px!important;border-radius:10px 10px 0 0!important;color:#7f8da4!important;font-size:12px!important;font-weight:690!important}
.w-tabs button:hover{background:#f5f8ff!important;color:#45669c!important}
.w-tabs button.active{background:linear-gradient(180deg,#edf4ff,transparent)!important;color:#2f64ca!important}
.w-tabs button.active:after{height:2px!important;background:var(--wb-primary)!important}

/* Tables */
.w-table-card{overflow:hidden!important}
.w-table-tools{padding:13px 15px!important;border-bottom:1px solid var(--wb-line)!important;background:#fbfdff!important}
.w-table{font-size:12px!important}
.w-table th{
  padding:12px 15px!important;background:#eef4ff!important;color:#61708a!important;border-bottom:1px solid #dae5f5!important;
  font-size:10px!important;font-weight:790!important;letter-spacing:.035em!important;text-transform:uppercase!important;
}
.w-table td{padding:13px 15px!important;border-bottom:1px solid #edf2f8!important;color:#43516a!important}
.w-table tr:hover td{background:#fafcff!important}
.w-table td small{color:#929daf!important;font-size:10px!important}
.w-product-thumb{border-radius:12px!important;border:1px solid #e6edf7!important;box-shadow:0 3px 10px rgba(23,59,115,.06)!important}
.w-noimg{background:#eff4fb!important;color:#94a2b5!important}

/* KPIs and charts */
.w-kpis{gap:14px!important}
.w-kpi{position:relative!important;overflow:hidden!important;border:1px solid #e1e9f5!important;border-radius:18px!important;background:#fff!important;box-shadow:0 8px 24px rgba(23,59,115,.04)!important}
.w-kpi:nth-child(4n+1){background:linear-gradient(145deg,#fbfdff,#edf4ff)!important}
.w-kpi:nth-child(4n+2){background:linear-gradient(145deg,#fbfffd,var(--wb-success-soft))!important}
.w-kpi:nth-child(4n+3){background:linear-gradient(145deg,#fffdfb,var(--wb-amber-soft))!important}
.w-kpi:nth-child(4n+4){background:linear-gradient(145deg,#fffdfd,var(--wb-danger-soft))!important}
.w-kpi span{color:#8290a5!important;font-size:10px!important;font-weight:720!important;letter-spacing:.03em!important;text-transform:uppercase!important}
.w-kpi strong{color:var(--wb-deep)!important;font-size:23px!important;font-weight:800!important;letter-spacing:-.04em!important}
.w-chart-card{background:var(--wb-white)!important}
.w-bars i{background:linear-gradient(180deg,#7fa6f6,#2f6fed)!important;border-radius:999px 999px 4px 4px!important}

/* Product editor and settings */
.w-product-editor{max-width:1180px!important;padding:25px!important}
.w-product-images{padding-bottom:21px!important;border-bottom:1px solid var(--wb-line)!important;margin-bottom:21px!important}
.w-image-preview img{border-radius:15px!important;border:1px solid #e4ecf7!important;box-shadow:0 7px 20px rgba(23,59,115,.06)!important}
.w-option-group{border:1px solid #dfe8f5!important;border-radius:16px!important;background:#f9fbff!important;padding:15px!important}
.w-option-row{gap:9px!important}
.w-setting-grid,.w-design-global{gap:16px!important}
.w-setting-row{border:1px solid #e0e8f4!important;border-radius:16px!important;background:#fff!important}
.w-toggle{background:#d7e0ed!important}.w-toggle.on{background:var(--wb-primary)!important}

/* Design templates / global */
.w-design-note{border:1px solid #d6e4f9!important;border-radius:15px!important;background:#eef4ff!important;color:#315a9d!important}
.w-template-grid{gap:16px!important}
.w-template-card{border:1px solid #dfe8f5!important;border-radius:20px!important;background:#fff!important;box-shadow:0 8px 24px rgba(23,59,115,.035)!important}
.w-template-card:hover{border-color:#bed0ee!important;transform:translateY(-2px)!important}
.w-template-card.active{border-color:#8fb2f5!important;background:#f4f8ff!important;box-shadow:0 0 0 3px rgba(47,111,237,.08),0 14px 32px rgba(23,59,115,.07)!important}
.w-template-phone{background:linear-gradient(180deg,#eef4ff,#fff)!important;border-color:#dbe5f5!important}
.w-template-phone div{background:linear-gradient(135deg,#315fbd,#6d99f3)!important}
.w-template-phone span{background:#dfe9f9!important}
.w-template-active{background:var(--wb-primary)!important;color:#fff!important}
.w-color-grid label,.w-font-grid label,.w-corner-grid label{border-color:#e0e8f4!important;background:#fff!important;border-radius:16px!important}
.w-color-grid input:checked+span,.w-font-grid input:checked+span,.w-corner-grid input:checked+span{border-color:#8fb2f5!important;box-shadow:0 0 0 3px rgba(47,111,237,.08)!important;background:#f2f7ff!important}
.w-preview-phone{border-color:#d6e2f3!important;background:#fff!important;box-shadow:0 25px 65px rgba(23,59,115,.12)!important}

/* Orders, clients, payments */
.w-filterbar,.w-filter-pills{background:transparent!important}
.w-filter-pills button{border:1px solid #dfe7f4!important;background:#fff!important;color:#66758d!important}
.w-filter-pills button.active{background:var(--wb-primary)!important;border-color:var(--wb-primary)!important;color:#fff!important}
.w-order-layout{border-color:#e0e8f4!important;border-radius:20px!important;background:#fff!important}
.w-order-head{background:#f8fbff!important;border-bottom:1px solid #e6edf7!important}
.w-order-side{background:#f5f8ff!important;border-color:#e0e8f4!important}
.w-order-item{border-color:#e8eef7!important}
.w-order-note{background:var(--wb-amber-soft)!important;border-color:#f1dba9!important;color:#84651d!important}
.w-order-totals .total{color:var(--wb-deep)!important}
.w-client-head{border-color:#e0e8f4!important;background:var(--wb-white)!important}
.w-client-actions .w-btn{background:#fff!important}
.w-history a{border-color:#e7edf6!important;background:#fff!important}.w-history a:hover{background:#f8fbff!important}
.w-integration-status{border-color:#dce6f4!important;background:#f8fbff!important}

/* Checkout / advanced */
.w-message-parts details,.w-dns-box,.w-danger-zone{border-color:#e0e8f4!important;border-radius:16px!important;background:#fff!important}
.w-whatsapp-preview{border-color:#dce6f4!important;background:#f5f8ff!important}
.w-wa-head{background:#356fd9!important;color:#fff!important}
.w-wa-bubble{background:#fff!important;border:1px solid #e1e9f4!important;box-shadow:0 6px 20px rgba(23,59,115,.05)!important}
.w-domain-status{background:#eef4ff!important;border-color:#d8e5f8!important;color:#365d9b!important}
.w-dns-row{border-color:#e7edf6!important;background:#fbfdff!important}
.w-danger-zone{border-color:#f2cdd1!important;background:#fff8f8!important}

/* Modals/drawers */
.w-modal{background:rgba(20,37,67,.38)!important;backdrop-filter:blur(8px)!important}
.w-modal-card{border:1px solid rgba(217,229,245,.9)!important;border-radius:24px!important;background:var(--wb-white)!important;box-shadow:var(--wb-shadow-lg)!important}
.w-modal-close,.w-drawer-close{background:#f0f4fb!important;color:#62718a!important;border:1px solid #e3eaf5!important}
.w-drawer{background:rgba(20,37,67,.36)!important;backdrop-filter:blur(6px)!important}
.w-drawer-panel{background:var(--wb-white)!important;box-shadow:-20px 0 60px rgba(23,59,115,.12)!important}

/* Landing — TARJIX landing grammar, Whapide blue */
.w-landing{background:
  radial-gradient(circle at 76% 12%,rgba(47,111,237,.13),transparent 23%),
  radial-gradient(circle at 18% 72%,rgba(102,116,217,.06),transparent 24%),
  #fbfdff!important}
.w-land-nav{height:78px!important}
.w-land-nav nav{gap:21px!important;color:#52617a!important;font-size:13px!important}
.w-hero{min-height:650px!important;gap:58px!important;padding-top:54px!important;padding-bottom:70px!important}
.w-eyebrow{color:var(--wb-primary)!important;font-size:11px!important;letter-spacing:.18em!important}
.w-hero h1{color:var(--wb-deep)!important;font-size:62px!important;line-height:1.03!important;font-weight:800!important}
.w-hero h1 em{color:var(--wb-primary)!important}
.w-hero p{color:#6f7d93!important;font-size:17px!important;line-height:1.7!important}
.w-phone{background:linear-gradient(180deg,#fff,#f7faff)!important;color:var(--wb-ink)!important;border:1px solid #dbe5f3!important;box-shadow:0 34px 90px rgba(47,111,237,.17)!important}
.w-phone-cover{background:linear-gradient(135deg,#173b73,#2f6fed 58%,#8eb2f8)!important}
.w-phone-logo{background:#fff!important;color:var(--wb-primary)!important;border-color:#fff!important;box-shadow:0 9px 28px rgba(23,59,115,.15)!important}
.w-chip-row span{border-color:#dfe8f5!important;background:#f0f5ff!important;color:#47618a!important}
.w-demo-product{border:1px solid #e3eaf5!important;box-shadow:0 8px 22px rgba(23,59,115,.04)!important}
.w-land-section h2{color:var(--wb-deep)!important;font-weight:800!important}
.w-feature-grid article{border-color:#e1e9f5!important;border-radius:22px!important;box-shadow:0 12px 34px rgba(23,59,115,.045)!important}
.w-feature-grid article>b{color:var(--wb-primary)!important}
.w-feature-grid p,.w-land-soft p{color:#77849a!important}
.w-land-soft{background:linear-gradient(135deg,#eef4ff,#f9fbff)!important;border:1px solid #dfe8f7!important}

/* Login */
.w-auth{background:
  radial-gradient(circle at 86% 15%,rgba(47,111,237,.14),transparent 28%),
  radial-gradient(circle at 9% 85%,rgba(102,116,217,.055),transparent 26%),
  var(--wb-primary-softer)!important}
.w-auth-card{border:1px solid #dce6f4!important;border-radius:26px!important;background:rgba(252,253,255,.97)!important;box-shadow:0 28px 80px rgba(23,59,115,.12)!important}
.w-auth-card h1{color:var(--wb-deep)!important;font-weight:800!important}
.w-auth-card p{color:#7d899d!important}

/* Kitchen + tracking */
.w-kitchen-screen{background:#eef4ff!important;color:var(--wb-ink)!important}
.w-kitchen-screen>header{background:linear-gradient(135deg,#173b73,#285fc4)!important;color:#fff!important;border-bottom:0!important}
.w-kitchen-screen>header h1,.w-kitchen-screen>header span{color:#fff!important}
.w-kitchen-board{background:#fff!important;border:1px solid #dce6f4!important;border-radius:18px!important;box-shadow:0 10px 28px rgba(23,59,115,.055)!important;color:var(--wb-ink)!important}
.w-kitchen-board-head{border-color:#e7edf6!important}.w-kitchen-note{background:var(--wb-amber-soft)!important;color:#765d22!important}
.w-track{background:radial-gradient(circle at 85% 10%,rgba(47,111,237,.12),transparent 25%),var(--wb-primary-softer)!important}
.w-track-status{background:#eef4ff!important;color:#315fbd!important;border-color:#d9e5f7!important}

/* Responsive — preserve TARJIX mobile density */
@media(max-width:1180px){
  .w-main{padding:26px 24px 42px!important}
  .w-merchant-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:820px){
  .w-top{height:64px!important;padding:0 14px!important}
  .w-shell{grid-template-columns:1fr!important;min-height:calc(100vh - 64px)!important}
  .w-side{
    position:sticky!important;top:64px!important;z-index:50!important;height:auto!important;
    display:flex!important;gap:4px!important;padding:7px 9px!important;overflow-x:auto!important;
    border-right:0!important;border-bottom:1px solid var(--wb-line)!important;background:rgba(252,253,255,.96)!important;
  }
  .w-side-title,.w-merchant-mini,.w-back{display:none!important}
  .w-nav{flex:0 0 auto!important;white-space:nowrap!important;min-height:38px!important;padding:8px 10px!important;border-radius:10px!important;font-size:11px!important}
  .w-nav.active{box-shadow:none!important;background:#eaf2ff!important}
  .w-main{padding:18px 14px 34px!important}
  .w-page-head{align-items:flex-start!important;flex-direction:column!important;gap:12px!important}
  .w-page-head h1{font-size:25px!important}
  .w-head-actions{width:100%!important;gap:7px!important}
  .w-head-actions .w-btn{flex:1 1 auto!important}
  .w-merchant-grid{grid-template-columns:1fr!important}
  .w-business-types{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .w-form-grid,.w-detail-grid,.w-client-layout,.w-design-global,.w-message-layout{grid-template-columns:1fr!important}
  .w-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .w-table th,.w-table td{padding:11px 12px!important}
  .w-user small,.w-role{display:none!important}
  .w-hero{grid-template-columns:1fr!important;min-height:auto!important;padding-top:44px!important}
  .w-hero h1{font-size:44px!important}
  .w-hero-demo{display:none!important}
  .w-feature-grid{grid-template-columns:1fr!important}
}
@media(max-width:560px){
  .w-main{padding:15px 10px 28px!important}
  .w-page-head h1{font-size:23px!important}
  .w-card,.w-info-card,.w-chart-card,.w-table-card,.w-product-editor{border-radius:17px!important}
  .w-pad,.w-product-editor{padding:16px!important}
  .w-kpis{grid-template-columns:1fr!important}
  .w-business-types{grid-template-columns:1fr 1fr!important}
  .w-btn{min-height:40px!important;font-size:12px!important}
  .w-input,.w-select,.w-textarea{min-height:42px!important;font-size:12px!important}
  .w-land-nav{height:68px!important;padding:0 16px!important}
  .w-hero{padding:36px 16px 54px!important}
  .w-hero h1{font-size:38px!important}
  .w-land-section{padding:64px 16px!important}
}

/* ======================================================================
   RESTAURANTE 01 · TARJIX WALLET GRAMMAR IN WHAPIDE BLUE
   The public catalog remains a presentation layer only: data is shared.
   ====================================================================== */
body.whapide-public{background:#f2f6ff!important;color:var(--wb-ink)!important}
body.whapide-public .template-food_1.w-storefront{
  --r1-brand:var(--brand,#2f6fed);
  --r1-navy:var(--secondary,#173b73);
  --r1-copy:#7b899f;
  --r1-line:#dbe6f5;
  --r1-page:#f2f6ff;
  --r1-card:#fcfdff;
  min-height:100svh!important;
  color:var(--r1-navy)!important;
  background:
    radial-gradient(circle at 92% 4%,color-mix(in srgb,var(--r1-brand) 9%,transparent),transparent 22%),
    radial-gradient(circle at 5% 68%,rgba(102,116,217,.045),transparent 24%),
    linear-gradient(180deg,#f9fbff 0%,#f3f7ff 42%,#eef4ff 100%)!important;
}
body.whapide-public .template-food_1 .w-r1-shell{
  width:100%!important;max-width:520px!important;margin:0 auto!important;padding:18px 14px 30px!important;
}
body.whapide-public .template-food_1 .w-r1-header{margin-bottom:14px!important}
body.whapide-public .template-food_1 .w-r1-identity{gap:11px!important}
body.whapide-public .template-food_1 .w-r1-identity .w-merchant-logo{
  width:52px!important;height:52px!important;flex-basis:52px!important;border-radius:16px!important;
  border:1px solid rgba(219,230,245,.9)!important;box-shadow:0 9px 25px rgba(23,59,115,.10)!important;
}
body.whapide-public .template-food_1 .w-r1-identity h1{color:var(--r1-navy)!important;font-size:20px!important;font-weight:800!important;letter-spacing:-.035em!important}
body.whapide-public .template-food_1 .w-r1-identity p{color:#7f8ca1!important;font-size:10px!important;font-weight:560!important}
body.whapide-public .template-food_1 .w-r1-search-wrap{margin-bottom:14px!important}
body.whapide-public .template-food_1 .w-r1-search{
  height:46px!important;border:1px solid var(--r1-line)!important;border-radius:15px!important;background:rgba(252,253,255,.98)!important;
  color:var(--r1-navy)!important;font-size:11.5px!important;box-shadow:0 7px 20px rgba(23,59,115,.045)!important;
}
body.whapide-public .template-food_1 .w-r1-search:focus{border-color:#94b5f2!important;box-shadow:0 0 0 4px rgba(47,111,237,.08)!important}
body.whapide-public .template-food_1 .w-store-cats.w-r1-cats{gap:8px!important;margin-bottom:20px!important}
body.whapide-public .template-food_1 .w-r1-cats button{
  flex:0 0 86px!important;min-width:86px!important;min-height:70px!important;padding:8px 6px!important;
  border:1px solid #dce6f5!important;border-radius:15px!important;background:rgba(252,253,255,.98)!important;color:#536581!important;
  font-size:9px!important;font-weight:690!important;box-shadow:0 7px 18px rgba(23,59,115,.04)!important;
}
body.whapide-public .template-food_1 .w-r1-cat-icon{
  width:30px!important;height:30px!important;border-radius:10px!important;background:#eaf2ff!important;color:#3d6ed1!important;
}
body.whapide-public .template-food_1 .w-r1-cats button:nth-child(3n+2) .w-r1-cat-icon{background:var(--wb-danger-soft)!important;color:#bd6167!important}
body.whapide-public .template-food_1 .w-r1-cats button:nth-child(3n+3) .w-r1-cat-icon{background:var(--wb-success-soft)!important;color:#3c9a78!important}
body.whapide-public .template-food_1 .w-r1-cats button:nth-child(4n) .w-r1-cat-icon{background:var(--wb-amber-soft)!important;color:#a27b29!important}
body.whapide-public .template-food_1 .w-r1-cats button.active{
  background:linear-gradient(180deg,color-mix(in srgb,var(--r1-brand) 90%,#fff),var(--r1-brand))!important;
  border-color:var(--r1-brand)!important;color:#fff!important;box-shadow:0 11px 24px color-mix(in srgb,var(--r1-brand) 22%,transparent)!important;
}
body.whapide-public .template-food_1 .w-r1-cats button.active .w-r1-cat-icon{background:rgba(255,255,255,.17)!important;color:#fff!important}
body.whapide-public .template-food_1 .w-r1-section-head{margin-bottom:11px!important}
body.whapide-public .template-food_1 .w-r1-section-head h2{font-size:18.5px!important;font-weight:800!important;letter-spacing:-.035em!important}
body.whapide-public .template-food_1 .w-r1-section-head p{margin-top:3px!important;color:#8996aa!important;font-size:9.8px!important}
body.whapide-public .template-food_1 .w-store-products.w-r1-products{gap:9px!important}
body.whapide-public .template-food_1 .w-r1-product{
  border:1px solid #dfe8f5!important;border-radius:17px!important;background:rgba(252,253,255,.99)!important;
  box-shadow:0 8px 24px rgba(23,59,115,.055)!important;
}
body.whapide-public .template-food_1 .w-r1-product-open{background:#f1f4f9!important;aspect-ratio:1.05/1!important}
body.whapide-public .template-food_1 .w-r1-product-open img{object-fit:cover!important}
body.whapide-public .template-food_1 .w-r1-product .w-store-product-body{padding:9px 9px 10px!important}
body.whapide-public .template-food_1 .w-r1-product h3{color:var(--r1-navy)!important;font-size:11.8px!important;font-weight:770!important}
body.whapide-public .template-food_1 .w-r1-product-desc{color:#7c899e!important;font-size:8.8px!important;line-height:1.34!important}
body.whapide-public .template-food_1 .w-r1-product .w-store-price strong{color:var(--r1-navy)!important;font-size:13.6px!important;font-weight:800!important}
body.whapide-public .template-food_1 .w-r1-add{
  width:31px!important;height:31px!important;flex-basis:31px!important;background:var(--r1-brand)!important;color:#fff!important;
  box-shadow:0 8px 18px color-mix(in srgb,var(--r1-brand) 23%,transparent)!important;
}
body.whapide-public .template-food_1 .w-r1-cart-float{
  min-height:44px!important;padding:7px 9px 7px 11px!important;border-radius:14px!important;
  background:linear-gradient(180deg,color-mix(in srgb,var(--r1-brand) 92%,#fff),var(--r1-brand))!important;
  box-shadow:0 14px 32px color-mix(in srgb,var(--r1-brand) 28%,rgba(23,59,115,.15))!important;
}
body.whapide-public .template-food_1 .w-r1-cart-float-label{font-size:10.5px!important;font-weight:730!important}

/* Product detail = TARJIX Wallet detail-sheet language */
body.whapide-public .template-food_1 #productDrawer{background:rgba(23,36,58,.36)!important;backdrop-filter:blur(7px)!important}
body.whapide-public .template-food_1 #productDrawer .w-drawer-panel{background:#fbfdff!important;box-shadow:0 28px 84px rgba(23,59,115,.18)!important}
body.whapide-public .template-food_1 #productDrawer .w-drawer-close{background:rgba(252,253,255,.96)!important;color:#62718b!important;border:1px solid #e0e8f4!important;box-shadow:0 7px 20px rgba(23,59,115,.09)!important}
body.whapide-public .template-food_1 .w-r1-detail-image{background:#eef3fa!important}
body.whapide-public .template-food_1 .w-r1-detail-sheet{background:#fbfdff!important;border-radius:24px 24px 0 0!important}
body.whapide-public .template-food_1 .w-r1-detail-head h2,body.whapide-public .template-food_1 .w-r1-detail-head strong{color:var(--r1-navy)!important}
body.whapide-public .template-food_1 .w-r1-detail-desc{color:#7c899d!important}
body.whapide-public .template-food_1 .w-r1-detail .w-product-options fieldset{border-top:1px solid #e6edf7!important}
body.whapide-public .template-food_1 .w-r1-detail .w-product-options fieldset label{
  min-height:44px!important;border:1px solid #dfe8f5!important;border-radius:13px!important;background:#fff!important;color:#4b5c75!important;
}
body.whapide-public .template-food_1 .w-r1-detail .w-product-options fieldset label:has(input:checked){border-color:#9bb8f0!important;background:#eef4ff!important;box-shadow:0 0 0 3px rgba(47,111,237,.055)!important}
body.whapide-public .template-food_1 .w-r1-stepper{border-color:#dfe8f5!important;background:#fff!important;border-radius:13px!important}
body.whapide-public .template-food_1 .w-r1-add-order{background:var(--r1-brand)!important;border-color:var(--r1-brand)!important;color:#fff!important;box-shadow:0 10px 22px color-mix(in srgb,var(--r1-brand) 20%,transparent)!important}
body.whapide-public .template-food_1 #cartDrawer{background:rgba(23,36,58,.36)!important;backdrop-filter:blur(7px)!important}
body.whapide-public .template-food_1 #cartDrawer .w-drawer-panel{background:#fbfdff!important}
body.whapide-public .template-food_1 .w-cart-line{border-bottom:1px solid #e8eef7!important;color:#52627b!important}
body.whapide-public .template-food_1 #checkoutModal{background:rgba(23,36,58,.40)!important;backdrop-filter:blur(8px)!important}
body.whapide-public .template-food_1 #checkoutModal .w-modal-card{border:1px solid #dfe8f5!important;background:#fcfdff!important;border-radius:23px!important;box-shadow:0 28px 80px rgba(23,59,115,.18)!important}
body.whapide-public .template-food_1 #checkoutModal .w-input,
body.whapide-public .template-food_1 #checkoutModal .w-select,
body.whapide-public .template-food_1 #checkoutModal .w-textarea{background:#fff!important;border-color:#dfe8f5!important;color:var(--r1-navy)!important}

@media(min-width:700px){
  body.whapide-public .template-food_1.w-storefront{padding:28px 0 60px!important}
  body.whapide-public .template-food_1 .w-r1-shell{
    border:1px solid #d9e4f4!important;border-radius:28px!important;background:rgba(252,253,255,.93)!important;
    box-shadow:0 28px 80px rgba(23,59,115,.10)!important;backdrop-filter:blur(10px)!important;
  }
}
@media(max-width:480px){
  body.whapide-public .template-food_1 .w-r1-shell{padding:13px 11px 24px!important}
  body.whapide-public .template-food_1 .w-r1-identity .w-merchant-logo{width:47px!important;height:47px!important;flex-basis:47px!important}
  body.whapide-public .template-food_1 .w-r1-identity h1{font-size:18px!important}
  body.whapide-public .template-food_1 .w-r1-cats button{flex-basis:78px!important;min-width:78px!important;min-height:65px!important}
  body.whapide-public .template-food_1 .w-r1-section-head h2{font-size:17.5px!important}
  body.whapide-public .template-food_1 .w-r1-product h3{font-size:11.1px!important}
  body.whapide-public .template-food_1 .w-r1-product-desc{font-size:8.4px!important}
  body.whapide-public .template-food_1 .w-r1-product .w-store-price strong{font-size:13px!important}
}


/* =========================================================
   WHAPIDE 0.9.1 · VIEWPORT / TOP CHROME ALIGNMENT
   WordPress must not reserve toolbar space on Whapide routes.
   ========================================================= */
html{margin-top:0!important;padding-top:0!important}
body.whapide-body{margin-top:0!important;padding-top:0!important}
body.whapide-body #wpadminbar{display:none!important}
.w-top{
  height:64px!important;
  min-height:64px!important;
  padding:0 22px!important;
  align-items:center!important;
}
.w-top-start,.w-top-right{height:100%!important;align-items:center!important}
.w-top .w-logo,.w-top-context,.w-top-kicker,.w-top-right>*{align-self:center!important}
.w-shell{min-height:calc(100vh - 64px)!important}
.w-side{top:64px!important;height:calc(100vh - 64px)!important}

@media(max-width:820px){
  .w-top{height:60px!important;min-height:60px!important;padding:0 12px!important}
  .w-shell{min-height:calc(100vh - 60px)!important}
  .w-side{top:60px!important}
}