/* Smart AI Search v4.1 */

/* ── Shortcode Search Bar ──────────────────────────────── */
.sas-searchbar{width:100%;position:relative;}
.sas-searchbar-form{margin:0;padding:0;}
.sas-searchbar-inner{display:flex;align-items:center;background:#fff;border:1.5px solid #c5d3e0;border-radius:50px;padding:0 6px 0 22px;height:50px;transition:box-shadow 0.2s;position:relative;}
.sas-searchbar-inner:focus-within{box-shadow:0 2px 12px rgba(0,0,0,0.06);}
.sas-searchbar-input{flex:1;border:none;outline:none;background:transparent;font-size:15px;font-weight:400;color:#111;padding:0;height:100%;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;min-width:0;position:relative;z-index:3;}
.sas-searchbar-input::placeholder{color:#8b9bb5;}
.sas-searchbar-scan{flex-shrink:0;background:none;border:none;padding:6px;cursor:pointer;color:#5b9bd5;border-radius:8px;transition:all 0.15s;display:flex;align-items:center;justify-content:center;margin-right:6px;position:relative;z-index:3;}
.sas-searchbar-scan:hover{color:#1a3a8a;background:rgba(26,58,138,0.06);}
.sas-searchbar-btn{flex-shrink:0;width:42px;height:42px;border-radius:50%;border:none;background:#1a3a8a;color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background 0.2s;box-shadow:0 2px 8px rgba(26,58,138,0.25);position:relative;z-index:3;}
.sas-searchbar-btn:hover{background:#142e6e;}
@media(max-width:768px){.sas-searchbar-inner{height:46px;padding:0 5px 0 18px;}.sas-searchbar-btn{width:38px;height:38px;}}
@media(max-width:480px){.sas-searchbar-inner{height:42px;padding:0 4px 0 14px;}.sas-searchbar-input{font-size:14px;}.sas-searchbar-btn{width:36px;height:36px;}}

/* ── Animated Placeholder ──────────────────────────────── */
.sas-ph{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;padding-left:22px;pointer-events:auto;cursor:text;z-index:2;overflow:hidden;white-space:nowrap;border-radius:50px;}
.sas-ph-prefix{color:#8b9bb5;font-size:15px;font-weight:400;flex-shrink:0;margin-right:5px;}
.sas-ph-slot{display:inline-block;position:relative;height:1.4em;overflow:hidden;vertical-align:bottom;}
.sas-ph-word{display:inline-block;color:#8b9bb5;font-size:15px;font-weight:400;transition:transform 0.4s cubic-bezier(0.4,0,0.2,1),opacity 0.4s cubic-bezier(0.4,0,0.2,1);}
.sas-ph-word.sas-ph-visible{transform:translateY(0);opacity:1;}
.sas-ph-word.sas-ph-exit{transform:translateY(-100%);opacity:0;}
.sas-ph-word.sas-ph-enter{transform:translateY(60%);opacity:0;transition:none;}
.sas-wrapper{position:relative;}
.sas-wrapper input[name="s"]::placeholder{color:transparent!important;}
.sas-wrapper [class*="fanim"],.sas-wrapper .animated-holder{display:none!important;}
.sas-barcode-btn{background:none;border:none;padding:8px;cursor:pointer;color:#5b9bd5;border-radius:8px;transition:all 0.15s;display:flex!important;align-items:center;justify-content:center;flex-shrink:0;z-index:3;position:relative;}
.sas-barcode-btn:hover{color:#1a3a8a;background:#eef4ff;}

/* ── Carousel — Simple chevron arrows (no circle) ──────── */
.sas-carousel{position:relative;padding:0 36px;}
.sas-ctrack{display:flex;gap:16px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:4px 0;}
.sas-ctrack::-webkit-scrollbar{display:none;}
.sas-al,.sas-ar{position:absolute;top:50%;transform:translateY(-50%);background:none;border:none;color:#1a3a8a;cursor:pointer;padding:4px;z-index:5;transition:opacity 0.15s;}
.sas-al:hover,.sas-ar:hover{opacity:0.7;}
.sas-al{left:0;}
.sas-ar{right:0;}

/* ── Dropdown ──────────────────────────────────────────── */
.sas-dropdown{position:absolute;top:calc(100% + 4px);left:0;width:1200px;max-width:96vw;z-index:99999;background:#fff;border:1px solid #dfe3e8;border-top:3px solid #1a3a8a;border-radius:0 0 16px 16px;box-shadow:0 24px 80px rgba(0,0,0,0.12),0 8px 24px rgba(0,0,0,0.06);max-height:82vh;overflow:hidden;display:flex;flex-direction:column;animation:sas-in 0.22s cubic-bezier(0.16,1,0.3,1);transform-origin:top left;}
@keyframes sas-in{from{opacity:0;transform:translateY(-8px) scaleY(0.97);}to{opacity:1;transform:translateY(0) scaleY(1);}}
.sas-dropdown.sas-closing{animation:sas-out 0.14s ease forwards;}
@keyframes sas-out{to{opacity:0;transform:translateY(-6px) scaleY(0.97);}}
.sas-dropdown-inner{overflow-y:auto;max-height:78vh;scrollbar-width:thin;scrollbar-color:#e5e7eb transparent;}
.sas-dropdown-inner::-webkit-scrollbar{width:5px;}
.sas-dropdown-inner::-webkit-scrollbar-thumb{background:#ddd;border-radius:3px;}

.sas-recent-bar{display:flex;align-items:center;gap:8px;padding:14px 24px;border-bottom:1px solid #f0f1f3;overflow-x:auto;white-space:nowrap;scrollbar-width:none;flex-shrink:0;}
.sas-recent-bar:empty{display:none;}.sas-recent-bar::-webkit-scrollbar{display:none;}
.sas-rlabel{font-size:13px;font-weight:700;color:#1a1a5e;white-space:nowrap;flex-shrink:0;}
.sas-rtag{display:inline-flex;align-items:center;gap:5px;padding:5px 14px;background:#f5f6f8;border:1px solid #e8eaed;border-radius:20px;font-size:12px;color:#374151;cursor:pointer;transition:all 0.15s;flex-shrink:0;}
.sas-rtag:hover{background:#e0e7ff;border-color:#c7d2fe;color:#3730a3;}
.sas-tag-x{font-size:15px;line-height:1;color:#aaa;cursor:pointer;}.sas-tag-x:hover{color:#ef4444;}
.sas-rclear{font-size:12px;color:#4f46e5;cursor:pointer;white-space:nowrap;flex-shrink:0;font-weight:600;margin-left:6px;}.sas-rclear:hover{text-decoration:underline;}
.sas-did-you-mean{padding:11px 24px;font-size:14px;color:#6b7280;border-bottom:1px solid #f0f1f3;background:#fffbeb;flex-shrink:0;}
.sas-did-you-mean a{color:#1a3a8a;font-weight:700;text-decoration:none;cursor:pointer;}.sas-did-you-mean a:hover{text-decoration:underline;}
.sas-content{padding:28px 32px 32px;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}
.sas-cols{display:grid;grid-template-columns:220px 1fr;gap:32px;}
.sas-col-left{border-right:1px solid #f0f1f3;padding-right:24px;}
.sas-col-left h3,.sas-col-right h3,.sas-section h3{font-size:17px;font-weight:700;color:#1a1a5e;margin:0 0 16px;font-family:Georgia,'Times New Roman',serif;font-style:italic;}
.sas-pop-list{list-style:none;margin:0;padding:0;}
.sas-pop-list li{padding:11px 4px;font-size:14px;color:#374151;cursor:pointer;border-bottom:1px solid #f7f7f7;transition:color 0.12s;}
.sas-pop-list li:last-child{border-bottom:none;}
.sas-pop-list li:hover,.sas-pop-list li.sas-kb-active{color:#1a3a8a;}

.sas-filter-bar{padding:10px 16px;background:#eef0ff;border:1px solid #d4d9f7;border-radius:10px;font-size:13px;color:#374151;margin-bottom:16px;display:flex;align-items:center;gap:6px;}
.sas-filter-bar strong{color:#1a3a8a;font-size:14px;}
.sas-cat-clear{margin-left:auto;background:#ef4444;color:#fff;border:none;border-radius:6px;padding:5px 14px;font-size:12px;font-weight:600;cursor:pointer;transition:all 0.15s;white-space:nowrap;}
.sas-cat-clear:hover{background:#dc2626;}
.sas-section{margin-bottom:28px;}.sas-section:last-child{margin-bottom:0;}

/* ── Product Cards — BIGGER ────────────────────────────── */
.sas-pcard{flex:0 0 auto;width:190px;background:#fff;border:1px solid #eef0f3;border-radius:14px;padding:16px 12px 14px;text-align:center;text-decoration:none;color:inherit;transition:all 0.18s;display:flex;flex-direction:column;align-items:center;cursor:pointer;}
.sas-pcard:hover,.sas-pcard.sas-kb-active{border-color:#b4bcf5;box-shadow:0 6px 20px rgba(99,102,241,0.1);transform:translateY(-3px);}
.sas-pcard-img{width:100%;height:130px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;}
.sas-pcard-img img{max-width:100%;max-height:100%;object-fit:contain;}
.sas-pcard-name{font-size:12px;font-weight:600;color:#374151;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px;}

.sas-catrow{gap:12px;}
.sas-catcard{flex:0 0 auto;min-width:110px;max-width:130px;background:#f9fafb;border:1px solid #eef0f3;border-radius:12px;padding:12px 8px 10px;text-align:center;color:inherit;transition:all 0.18s;cursor:pointer;}
.sas-catcard:hover{border-color:#6366f1;background:#fff;box-shadow:0 3px 12px rgba(99,102,241,0.08);}
.sas-catcard img{width:52px;height:44px;object-fit:contain;margin:0 auto 8px;display:block;}
.sas-catcard span{font-size:11px;font-weight:700;color:#374151;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

.sas-loading{display:flex;justify-content:center;padding:48px;}
.sas-spinner{width:28px;height:28px;border:3px solid #eef0f3;border-top-color:#6366f1;border-radius:50%;animation:sas-spin 0.6s linear infinite;}
@keyframes sas-spin{to{transform:rotate(360deg);}}
.sas-empty{text-align:center;padding:48px 20px;}
.sas-empty strong{display:block;color:#374151;font-size:15px;margin-bottom:6px;}
.sas-empty span{font-size:13px;color:#9ca3af;}

/* ── Desktop dropdown responsive ───────────────────────── */
@media(max-width:1024px){.sas-dropdown{width:100%;max-width:100vw;}.sas-pcard{width:170px;}}
@media(max-width:768px){
    .sas-dropdown{display:none!important;} /* HIDE dropdown on mobile — use fullscreen instead */
    .sas-ph{padding-left:18px;}
}


/* ═══════════════════════════════════════════════════════════
   FULL-SCREEN — Mobile-first design (back arrow, pills, suggestions, grid)
   ═══════════════════════════════════════════════════════════ */

.sas-fs{position:fixed;inset:0;z-index:1000000;background:#fff;display:flex;flex-direction:column;overflow:hidden;animation:sas-fs-in 0.2s ease;}
@keyframes sas-fs-in{from{opacity:0;}to{opacity:1;}}

/* Header: ← input barcode/clear */
.sas-fs-header{
    flex-shrink:0;display:flex;align-items:center;gap:8px;
    padding:12px 16px;border-bottom:1px solid #eee;background:#fff;
}
.sas-fs-back{background:none;border:none;color:#374151;cursor:pointer;padding:6px;display:flex;align-items:center;flex-shrink:0;}
.sas-fs-back:hover{color:#111;}
.sas-fs-input{flex:1;border:none;outline:none;font-size:16px;color:#111;background:transparent;padding:8px 0;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;}
.sas-fs-input::placeholder{color:#bbb;}
.sas-fs-scan,.sas-fs-clear{background:none;border:none;color:#9ca3af;cursor:pointer;padding:6px;display:flex;align-items:center;flex-shrink:0;}
.sas-fs-scan:hover,.sas-fs-clear:hover{color:#374151;}

/* Category pills */
.sas-fs-pills{display:flex;gap:8px;padding:12px 16px;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid #f3f4f6;flex-shrink:0;}
.sas-fs-pills::-webkit-scrollbar{display:none;}
.sas-fs-pills:empty{display:none;}
.sas-pill{background:#f3f4f6;border:1px solid #e5e7eb;border-radius:20px;padding:7px 16px;font-size:13px;color:#374151;cursor:pointer;white-space:nowrap;transition:all 0.15s;flex-shrink:0;font-family:inherit;}
.sas-pill:hover{background:#e0e7ff;border-color:#c7d2fe;color:#3730a3;}
.sas-pill.active{background:#1a3a8a;color:#fff;border-color:#1a3a8a;}

/* Suggestions (while typing) */
.sas-fs-suggestions{flex-shrink:0;border-bottom:1px solid #f3f4f6;max-height:300px;overflow-y:auto;}
.sas-fs-sugg-item{display:flex;align-items:center;gap:12px;padding:14px 16px;cursor:pointer;transition:background 0.1s;border-bottom:1px solid #fafafa;}
.sas-fs-sugg-item:hover{background:#f9fafb;}
.sas-fs-sugg-item svg{flex-shrink:0;color:#ccc;}
.sas-fs-sugg-item span{flex:1;font-size:15px;color:#374151;}
.sas-fs-sugg-arrow{margin-left:auto;color:#ddd;}

/* Results header */
.sas-fs-results-header{display:flex;align-items:center;justify-content:space-between;padding:14px 16px;flex-shrink:0;border-bottom:1px solid #f3f4f6;}
.sas-fs-results-header span{font-size:14px;color:#6b7280;}
.sas-fs-viewall{font-size:14px;color:#1a3a8a;font-weight:600;text-decoration:none;cursor:pointer;}
.sas-fs-viewall:hover{text-decoration:underline;}

/* DYM */
.sas-fs-dym{padding:12px 16px;background:#fffbeb;border-bottom:1px solid #fde68a;font-size:14px;color:#92400e;flex-shrink:0;}
.sas-fs-dym a{color:#1a3a8a;font-weight:700;text-decoration:none;cursor:pointer;}
.sas-fs-dym a:hover{text-decoration:underline;}

/* Product grid */
.sas-fs-grid{flex:1;overflow-y:auto;padding:16px;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;align-content:start;}
.sas-fs-card{background:#fff;border:1px solid #eef0f3;border-radius:14px;padding:14px;text-align:center;text-decoration:none;color:inherit;transition:all 0.18s;display:flex;flex-direction:column;align-items:center;}
.sas-fs-card:hover{border-color:#c7d2fe;box-shadow:0 4px 16px rgba(99,102,241,0.1);}
.sas-fs-card-img{width:100%;height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:8px;}
.sas-fs-card-img img{max-width:100%;max-height:100%;object-fit:contain;}
.sas-fs-card-title{font-size:12px;font-weight:600;color:#374151;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sas-fs-pag{grid-column:1/-1;display:flex;justify-content:center;gap:6px;margin-top:12px;}
.sas-fs-pg{display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border-radius:10px;font-size:13px;font-weight:600;text-decoration:none;color:#374151;background:#fff;border:1px solid #e5e7eb;cursor:pointer;transition:all 0.15s;}
.sas-fs-pg:hover{background:#f0f0ff;border-color:#c7d2fe;color:#4f46e5;}
.sas-fs-pg.active{background:#1a3a8a;color:#fff;border-color:#1a3a8a;}
.sas-fs-empty{grid-column:1/-1;text-align:center;padding:48px 16px;color:#6b7280;font-size:15px;}

/* Desktop fullscreen: wider layout */
@media(min-width:769px){
    .sas-fs-header{padding:16px 24px;gap:12px;border-bottom:2px solid #1a3a8a;background:#f9fafb;}
    .sas-fs-input{font-size:18px;}
    .sas-fs-grid{grid-template-columns:repeat(4,1fr);gap:18px;padding:24px;max-width:1100px;margin:0 auto;}
    .sas-fs-card{padding:18px;}
    .sas-fs-card-img{height:140px;}
    .sas-fs-card-title{font-size:13px;}
    .sas-fs-pills{padding:14px 24px;gap:10px;max-width:1100px;margin:0 auto;width:100%;}
    .sas-fs-results-header{max-width:1100px;margin:0 auto;width:100%;padding:16px 24px;}
    .sas-fs-dym{max-width:1100px;margin:0 auto;width:100%;}
    .sas-fs-suggestions{max-width:1100px;margin:0 auto;width:100%;}
}

@media(max-width:480px){
    .sas-fs-card{padding:10px;}
    .sas-fs-card-img{height:90px;}
    .sas-fs-card-title{font-size:11px;}
    .sas-fs-grid{gap:10px;padding:12px;}
    .sas-pill{padding:6px 14px;font-size:12px;}
}


/* ═══════════════════════════════════════════════════════════
   BARCODE SCANNER MODAL
   ═══════════════════════════════════════════════════════════ */

.sas-scan-modal{position:fixed;inset:0;z-index:1000001;background:rgba(0,0,0,0.5);display:flex;align-items:center;justify-content:center;padding:16px;}
.sas-scan-box{background:#fff;border-radius:16px;width:100%;max-width:460px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 24px 60px rgba(0,0,0,0.25);}
.sas-scan-header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #f0f1f3;}
.sas-scan-title{font-size:16px;font-weight:700;color:#1a3a8a;}
.sas-scan-x{background:none;border:none;font-size:28px;color:#6b7280;cursor:pointer;padding:4px 8px;line-height:1;border-radius:8px;transition:all 0.15s;}
.sas-scan-x:hover{color:#111;background:#f3f4f6;}
.sas-scan-reader{width:100%;min-height:250px;background:#000;}
.sas-scan-reader video{width:100%;display:block;}
.sas-scan-tabs{display:flex;border-bottom:1px solid #f0f1f3;}
.sas-scan-tab{flex:1;padding:14px 16px;font-size:13px;font-weight:700;border:none;background:#f5f7fa;color:#6b7280;cursor:pointer;transition:all 0.15s;border-bottom:3px solid transparent;text-transform:uppercase;}
.sas-scan-tab.active{background:#fff;color:#1a3a8a;border-bottom-color:#1a3a8a;}
.sas-scan-tab:hover:not(.active){background:#eef0ff;}
.sas-scan-panel{flex:1;overflow-y:auto;max-height:300px;}
.sas-scan-results{padding:16px;}
.sas-scan-empty{text-align:center;padding:40px 16px;background:#f0f7ff;border-radius:12px;}
.sas-scan-empty strong{display:block;color:#1a3a8a;font-size:15px;margin-bottom:4px;}
.sas-scan-empty span{font-size:13px;color:#6b7280;}
.sas-scan-item{display:flex;align-items:center;gap:14px;padding:12px;border:1px solid #f0f1f3;border-radius:12px;margin-bottom:10px;text-decoration:none;color:inherit;transition:all 0.15s;}
.sas-scan-item:hover{border-color:#c7d2fe;background:#fafbff;}
.sas-scan-item img{width:56px;height:56px;object-fit:contain;border-radius:8px;flex-shrink:0;background:#f9fafb;}
.sas-scan-item-info{flex:1;min-width:0;}
.sas-scan-item-info strong{display:block;font-size:13px;color:#111;line-height:1.3;}
.sas-scan-item-info span{font-size:11px;color:#9ca3af;}
.sas-scan-item-miss{background:#fef2f2;border-color:#fecaca;}
.sas-scan-help{padding:16px;}
.sas-scan-tip{padding:14px;border:1px solid #e8edf2;border-radius:12px;margin-bottom:10px;background:#f8fafc;font-size:12px;color:#6b7280;line-height:1.5;}
.sas-scan-tip strong{display:block;font-size:13px;color:#1a3a8a;margin-bottom:2px;}