/* SkopeSana polish layer — keeps the original design, fixes small issues only */

/* Flash-sale product names were near-invisible (slate-300 on white) */
#flash-grid p{color:#1e293b !important;font-weight:600}

/* Struck-through "was" prices a touch more legible */
#flash-grid .line-through,#main-products-grid .line-through,#best-sellers-grid .line-through{color:#64748b !important}

/* Clear keyboard focus for accessibility */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ffbf00 !important;outline-offset:2px}

/* Popups (SweetAlert2): classy & clean */
.swal2-container.swal2-backdrop-show{background:rgba(15,23,42,.45)!important;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.swal2-popup:not(.swal2-toast){width:min(420px,calc(100vw - 32px))!important;padding:32px 28px 26px!important;border-radius:22px!important;background:#fff!important;border:1px solid #eef1f4!important;box-shadow:0 24px 60px -12px rgba(15,23,42,.28)!important;font-family:'Montserrat',system-ui,sans-serif!important}
.swal2-popup:not(.swal2-toast) .swal2-title{font-size:20px!important;font-weight:800!important;color:#0f172a!important;letter-spacing:-.01em!important;text-transform:none!important;padding:6px 0 0!important;line-height:1.3!important}
.swal2-popup:not(.swal2-toast) .swal2-html-container{font-size:14.5px!important;line-height:1.6!important;color:#475569!important;font-weight:500!important;margin:10px 4px 0!important;text-transform:none!important;letter-spacing:0!important}
.swal2-popup:not(.swal2-toast) .swal2-icon{transform:scale(.72);margin:-10px auto -6px!important}
.swal2-container{z-index:10000!important}
.swal2-icon.swal2-success{border-color:#bbf7d0!important;color:#008a00!important}
.swal2-icon.swal2-success [class^=swal2-success-line]{background-color:#008a00!important}
.swal2-icon.swal2-success .swal2-success-ring{border-color:rgba(0,138,0,.2)!important}
.swal2-icon.swal2-error{border-color:#fecaca!important}.swal2-icon.swal2-error [class^=swal2-x-mark-line]{background-color:#dc2626!important}
.swal2-icon.swal2-warning{border-color:#fde68a!important;color:#d97706!important}
.swal2-icon.swal2-info{border-color:#bfdbfe!important;color:#2563eb!important}
.swal2-icon.swal2-question{border-color:#e2e8f0!important;color:#475569!important}
.swal2-popup .swal2-actions{gap:10px!important;margin-top:22px!important;width:100%!important;flex-wrap:nowrap!important}
.swal2-popup .swal2-styled{margin:0!important;flex:1 1 0;min-height:46px!important;padding:12px 20px!important;border-radius:12px!important;font-family:'Montserrat',system-ui,sans-serif!important;font-size:14px!important;font-weight:700!important;letter-spacing:0!important;text-transform:none!important;box-shadow:none!important;transition:filter .15s,transform .15s}
.swal2-popup .swal2-styled:hover{filter:brightness(.95);transform:translateY(-1px)}
.swal2-popup .swal2-styled:focus-visible{outline:3px solid #ffbf00!important;outline-offset:2px}
.swal2-popup .swal2-styled.swal2-confirm{background:#008a00!important;color:#fff!important}
.swal2-popup .swal2-styled.swal2-deny{background:#dc2626!important;color:#fff!important}
.swal2-popup .swal2-styled.swal2-cancel{background:#f1f5f9!important;color:#334155!important}
.swal2-popup .swal2-close{width:36px!important;height:36px!important;margin:10px 10px 0 0!important;border-radius:10px!important;font-size:26px!important;color:#94a3b8!important}
.swal2-popup .swal2-close:hover{background:#f1f5f9!important;color:#0f172a!important}
.swal2-popup .swal2-input,.swal2-popup .swal2-textarea,.swal2-popup .swal2-select{margin:16px 0 0!important;width:100%!important;border-radius:12px!important;border:1px solid #e2e8f0!important;background:#f8fafc!important;box-shadow:none!important;font-size:15px!important;font-family:inherit!important}
.swal2-popup .swal2-input:focus,.swal2-popup .swal2-textarea:focus{border-color:#008a00!important;box-shadow:0 0 0 3px rgba(0,138,0,.15)!important}
.swal2-popup .swal2-validation-message{background:#fef2f2!important;color:#b91c1c!important;border-radius:10px!important;font-size:13px!important}
.swal2-popup .swal2-footer{border-top:1px solid #f1f5f9!important;font-size:13px!important;color:#64748b!important}
.swal2-timer-progress-bar{background:rgba(0,138,0,.5)!important}
.swal2-show{animation:sk-pop .22s cubic-bezier(.2,.9,.3,1.2)!important}
@keyframes sk-pop{from{opacity:0;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
/* Toasts */
.swal2-popup.swal2-toast{padding:12px 16px!important;border-radius:14px!important;background:#fff!important;border:1px solid #eef1f4!important;box-shadow:0 12px 32px -8px rgba(15,23,42,.25)!important;font-family:'Montserrat',system-ui,sans-serif!important}
.swal2-popup.swal2-toast .swal2-title{font-size:14px!important;font-weight:700!important;color:#0f172a!important;margin:0 0 0 10px!important}
.swal2-popup.swal2-toast .swal2-icon{transform:scale(.85);margin:0!important}
@media (max-width:480px){.swal2-popup .swal2-actions{flex-direction:column-reverse!important}.swal2-popup .swal2-styled{width:100%!important}}
.swal2-popup .swal2-actions button{text-transform:none!important;letter-spacing:0!important;box-shadow:none!important;font-family:'Montserrat',system-ui,sans-serif!important;font-size:14px!important;font-weight:700!important;border-radius:12px!important;min-height:46px}
.swal2-popup.swal2-toast .swal2-html-container{color:#475569!important;font-size:13px!important}

/* Footer: clean 2-column layout on phones */
@media (max-width:767px){
footer .grid.md\:grid-cols-4{grid-template-columns:1fr 1fr!important;column-gap:20px!important;row-gap:30px!important;margin-bottom:32px!important}
footer .grid.md\:grid-cols-4>:first-child{grid-column:1/-1!important;display:flex!important;flex-direction:column;align-items:center;text-align:center;padding-bottom:26px;border-bottom:1px solid rgba(255,255,255,.12)}
footer .grid.md\:grid-cols-4>:first-child>*{margin-top:0!important;margin-bottom:14px!important}
footer .grid.md\:grid-cols-4>:first-child p{max-width:300px;font-size:14px!important;line-height:1.55!important}
footer .grid.md\:grid-cols-4>:first-child .flex.gap-4{justify-content:center}
footer .grid.md\:grid-cols-4>:last-child{grid-column:1/-1!important;padding:18px;border-radius:16px;background:rgba(255,255,255,.07)}
footer .grid.md\:grid-cols-4 h5{margin-bottom:12px!important;font-size:12px!important}
footer .grid.md\:grid-cols-4 ul{display:flex;flex-direction:column;gap:10px}
footer .grid.md\:grid-cols-4 ul>li{margin:0!important;font-size:14px!important}
footer .border-t.pt-8{padding-top:20px!important;gap:12px!important}
footer .border-t.pt-8 .flex-wrap{gap:8px 18px!important}
}

/* Dropdowns (select): clean focus + styled open list where supported */
select{cursor:pointer}
select:focus-visible{outline:none!important;box-shadow:0 0 0 3px rgba(0,138,0,.18)!important}
@supports (appearance: base-select){
  select:not([multiple]),select:not([multiple])::picker(select){appearance:base-select}
  select:not([multiple]){display:inline-flex;align-items:center}
  *:has(> select ~ i) > select::picker-icon,*:has(> i ~ select) > select::picker-icon,*:has(> select ~ svg) > select::picker-icon,*:has(> select ~ span > i) > select::picker-icon{display:none}
  select::picker-icon{color:#64748b;transition:rotate .2s}
  select:open::picker-icon{rotate:180deg}
  select::picker(select){border:1px solid #e2e8f0;border-radius:14px;padding:6px;background:#fff;box-shadow:0 18px 40px -12px rgba(15,23,42,.28);margin-block:6px;min-width:anchor-size(width);font-family:'Montserrat',system-ui,sans-serif;opacity:0;translate:0 -4px;transition:opacity .15s,translate .15s,overlay .15s allow-discrete,display .15s allow-discrete}
  select:open::picker(select){opacity:1;translate:0 0}
  @starting-style{select:open::picker(select){opacity:0;translate:0 -4px}}
  select option{padding:10px 12px;border-radius:10px;font-size:14px;font-weight:600;color:#334155;text-transform:none;letter-spacing:0;gap:10px;cursor:pointer}
  select option:hover,select option:focus-visible{background:#f0fdf4;color:#008a00;outline:none}
  select option:checked{background:#008a00;color:#fff}
  select option::checkmark{display:none}
}