/* CYGNUSXSTORE V2 — modern blue/cyan responsive theme */
:root {
    --cy-bg: #07111f;
    --cy-bg-soft: #0b1728;
    --cy-card: rgba(15, 30, 50, .88);
    --cy-card-2: rgba(20, 41, 66, .86);
    --cy-border: rgba(125, 211, 252, .15);
    --cy-text: #e8f3ff;
    --cy-muted: #94a9c3;
    --cy-primary: var(--xez-primary, #38bdf8);
    --cy-secondary: var(--xez-secondary, #2563eb);
    --cy-shadow: 0 20px 60px rgba(2, 8, 23, .32);
}

body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 10% 0%, rgba(56, 189, 248, .13), transparent 30%),
        radial-gradient(circle at 90% 8%, rgba(37, 99, 235, .16), transparent 34%),
        linear-gradient(180deg, #f6fbff 0%, #eef7ff 100%);
    color: #0f172a;
}

body.theme-dark {
    background:
        radial-gradient(circle at 10% 0%, rgba(56, 189, 248, .12), transparent 31%),
        radial-gradient(circle at 90% 8%, rgba(37, 99, 235, .14), transparent 34%),
        linear-gradient(180deg, #050d18 0%, #071422 100%);
    color: var(--cy-text);
}

.main-navbar {
    background: rgba(255,255,255,.82) !important;
    border-bottom: 1px solid rgba(14,165,233,.12);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 32px rgba(15, 23, 42, .06);
}
body.theme-dark .main-navbar { background: rgba(5,13,24,.82) !important; border-bottom-color: var(--cy-border); }

.navbar-text-brand { letter-spacing: .2px; }
.nav-link-xez, .main-navbar .nav-link { border-radius: 12px; transition: .2s ease; }
.nav-link-xez:hover, .main-navbar .nav-link:hover { background: rgba(56,189,248,.09); transform: translateY(-1px); }

.xez-card, .xdvz-card, .card {
    border: 1px solid rgba(14,165,233,.10) !important;
    border-radius: 22px !important;
    box-shadow: var(--cy-shadow);
}
body.theme-dark .xez-card, body.theme-dark .xdvz-card, body.theme-dark .card {
    background: var(--cy-card) !important;
    border-color: var(--cy-border) !important;
    color: var(--cy-text);
}

.form-control, .form-select, .input-group-text {
    border-radius: 13px;
    border-color: rgba(100,116,139,.20);
    min-height: 46px;
}
.form-control:focus, .form-select:focus {
    border-color: var(--cy-primary);
    box-shadow: 0 0 0 .22rem rgba(56,189,248,.14);
}
body.theme-dark .form-control, body.theme-dark .form-select, body.theme-dark .input-group-text {
    background: rgba(8,20,34,.8) !important;
    color: var(--cy-text) !important;
    border-color: var(--cy-border) !important;
}

.btn { border-radius: 13px !important; font-weight: 600; }
.xez-btn-cyan, .xdvz-btn-cyan, .btn-navbar-register {
    border: 0 !important;
    color: #fff !important;
    background: linear-gradient(135deg, var(--cy-primary), var(--cy-secondary)) !important;
    box-shadow: 0 10px 28px rgba(14,165,233,.22);
}
.xez-btn-cyan:hover, .xdvz-btn-cyan:hover, .btn-navbar-register:hover { transform: translateY(-1px); filter: brightness(1.04); }

.admin-sidebar { position: sticky; top: 88px; }
.admin-sidebar .list-group-item {
    border: 0 !important;
    border-radius: 12px !important;
    margin-bottom: 4px;
    background: transparent;
    transition: .2s ease;
}
.admin-sidebar .list-group-item.active,
.admin-sidebar .list-group-item:hover {
    background: linear-gradient(135deg, rgba(56,189,248,.16), rgba(37,99,235,.12)) !important;
    color: var(--cy-primary) !important;
}
body.theme-dark .admin-sidebar .list-group-item { color: var(--cy-muted); }

.table { --bs-table-bg: transparent; }
body.theme-dark .table { color: var(--cy-text); }

.api-secret-wrap { position: relative; }
.api-secret-status { font-size: .78rem; color: #64748b; }
.api-status-dot { width: 9px; height: 9px; border-radius: 50%; display: inline-block; margin-right: 7px; }
.api-status-dot.on { background: #22c55e; box-shadow: 0 0 0 5px rgba(34,197,94,.10); }
.api-status-dot.off { background: #94a3b8; }

.site-footer { background: linear-gradient(135deg, #07111f 0%, #0b1d35 100%) !important; border-top: 1px solid rgba(56,189,248,.14); }
.site-footer .footer-heading { color: #7dd3fc !important; }
.site-footer .footer-title, .site-footer .footer-desc, .site-footer .footer-links a { color: #cbd5e1 !important; }

@media (max-width: 991.98px) {
    .admin-sidebar { position: static; }
    .main-navbar .navbar-collapse { padding: 12px 0; }
    .xez-card, .xdvz-card, .card { border-radius: 18px !important; }
}

@media (max-width: 575.98px) {
    body { font-size: 14px; }
    .container-sm, .container { padding-left: 14px; padding-right: 14px; }
    .p-4.p-lg-5 { padding: 1.15rem !important; }
    .site-footer { padding-top: 38px !important; }
}

/* CYGNUSXSTORE V2.3 — unified responsive storefront */
html, body { max-width: 100%; overflow-x: hidden; }
img { max-width: 100%; }
.min-w-0 { min-width: 0; }
.store-page { width: 100%; }
.store-hero,
.store-section-head,
.store-api-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}
.store-kicker {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: 7px 12px;
    margin-bottom: 10px;
    color: var(--cy-primary);
    background: rgba(56,189,248,.10);
    font-size: .78rem;
    font-weight: 700;
    letter-spacing: .06em;
}
.store-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 12px;
}
.store-tab {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px;
    border: 1px solid rgba(14,165,233,.12);
    border-radius: 18px;
    color: inherit;
    text-decoration: none;
    background: rgba(255,255,255,.72);
    transition: .18s ease;
}
.store-tab:hover { transform: translateY(-1px); border-color: rgba(14,165,233,.30); color: inherit; }
.store-tab.active {
    color: var(--cy-primary);
    border-color: rgba(14,165,233,.36);
    background: rgba(56,189,248,.10);
    box-shadow: 0 10px 30px rgba(14,165,233,.08);
}
.store-tab-icon {
    flex: 0 0 42px;
    width: 42px;
    height: 42px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    background: rgba(56,189,248,.10);
}
.store-tab strong, .store-tab small { display: block; }
.store-tab small { margin-top: 2px; color: #64748b; font-size: .76rem; line-height: 1.25; }
body.theme-dark .store-tab { background: rgba(10,25,43,.72); border-color: var(--cy-border); }
body.theme-dark .store-tab small { color: var(--cy-muted); }

.store-category-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 16px;
}
.store-category-card {
    position: relative;
    min-height: 190px;
    overflow: hidden;
    border-radius: 22px;
    color: #fff;
    text-decoration: none;
    box-shadow: var(--cy-shadow);
    background: #0f172a;
}
.store-category-card img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition: transform .35s ease; }
.store-category-card:hover img { transform: scale(1.035); }
.store-category-overlay { position:absolute; inset:0; background: linear-gradient(180deg,rgba(2,6,23,.04),rgba(2,6,23,.78)); }
.store-category-copy { position:absolute; inset:auto 18px 18px; min-width:0; }
.store-category-copy strong { display:block; font-size:1.12rem; }
.store-category-copy small { display:block; margin-top:4px; opacity:.82; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

.store-product-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0,1fr));
    gap: 16px;
}
.store-product-card {
    min-width: 0;
    overflow: hidden;
    border-radius: 20px;
    border: 1px solid rgba(14,165,233,.10);
    background: rgba(255,255,255,.86);
    box-shadow: 0 12px 36px rgba(15,23,42,.08);
    color: inherit;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
.store-product-card:hover { transform: translateY(-2px); border-color: rgba(14,165,233,.26); box-shadow: 0 16px 42px rgba(15,23,42,.11); color: inherit; }
body.theme-dark .store-product-card { background: var(--cy-card); border-color: var(--cy-border); }
.store-product-link { display:flex; flex-direction:column; height:100%; color:inherit; text-decoration:none; }
.store-product-media { position:relative; aspect-ratio: 1/1; overflow:hidden; background: rgba(148,163,184,.08); }
.store-product-media > img { width:100%; height:100%; object-fit:cover; transition: transform .25s ease; }
.store-product-card:hover .store-product-media > img { transform: scale(1.025); }
.store-product-body { min-width:0; padding: 13px; display:flex; flex-direction:column; flex:1; }
.store-product-body h6 { margin: 0 0 10px; font-weight:700; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:2.8em; }
.store-product-category { color: var(--cy-primary); font-size:.75rem; font-weight:600; margin-bottom:4px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.store-product-meta { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-top:auto; margin-bottom:10px; }
.store-product-meta strong { color: var(--cy-primary); white-space:nowrap; }
.store-product-meta span { color:#64748b; font-size:.75rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
body.theme-dark .store-product-meta span { color: var(--cy-muted); }
.store-card-action { min-height: 40px; display:flex; align-items:center; justify-content:center; padding:.5rem .65rem !important; font-size:.86rem; }
.store-provider-chip { position:absolute; top:9px; left:9px; max-width:calc(100% - 18px); padding:5px 8px; border-radius:999px; background:rgba(2,6,23,.70); color:#fff; font-size:.68rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; backdrop-filter:blur(8px); }
.store-image-fallback { position:absolute; inset:0; display:none; align-items:center; justify-content:center; font-size:2.4rem; color:var(--cy-primary); background:rgba(56,189,248,.08); }
.store-image-fallback.visible { display:flex; }

.store-search-wrap { position:relative; width:min(380px,100%); margin:0; }
.store-search-wrap > i { position:absolute; left:14px; top:50%; transform:translateY(-50%); color:#64748b; z-index:2; }
.store-search-wrap .form-control { padding-left:40px; width:100%; }
.store-empty { grid-column:1/-1; min-height:220px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; padding:28px; text-align:center; border:1px dashed rgba(100,116,139,.24); border-radius:20px; color:#64748b; }
.store-empty i { font-size:2rem; color:var(--cy-primary); }
.store-empty p { margin:0; font-weight:600; }

.api-order-list { display:grid; gap:12px; }
.api-order-card { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr) auto; gap:16px; align-items:center; padding:16px; border:1px solid rgba(14,165,233,.10); border-radius:18px; background:rgba(255,255,255,.86); box-shadow:0 10px 30px rgba(15,23,42,.06); }
body.theme-dark .api-order-card { background:var(--cy-card); border-color:var(--cy-border); }
.api-order-main { display:flex; align-items:center; gap:12px; min-width:0; }
.api-order-icon { flex:0 0 42px; width:42px; height:42px; border-radius:13px; display:grid; place-items:center; color:var(--cy-primary); background:rgba(56,189,248,.10); }
.api-order-delivery { display:grid; gap:6px; min-width:0; }
.api-order-delivery > div { min-width:0; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:7px 10px; border-radius:10px; background:rgba(148,163,184,.08); }
.api-order-delivery span { color:#64748b; font-size:.74rem; }
.api-order-delivery strong { font-family:ui-monospace,SFMono-Regular,Menlo,monospace; min-width:0; overflow-wrap:anywhere; }
.api-order-side { display:flex; flex-direction:column; align-items:flex-end; gap:5px; white-space:nowrap; }
.api-order-side strong { color:var(--cy-primary); }
.api-order-side small { color:#64748b; font-size:.72rem; }
.api-order-message { grid-column:1/-1; padding:8px 10px; border-radius:10px; background:rgba(148,163,184,.08); color:#64748b; font-size:.78rem; overflow-wrap:anywhere; }

@media (max-width: 1199.98px) {
    .store-product-grid { grid-template-columns: repeat(4, minmax(0,1fr)); }
}
@media (max-width: 991.98px) {
    .main-navbar .navbar-collapse { max-height: calc(100vh - 78px); overflow-y:auto; }
    .main-navbar .navbar-nav { gap:4px; }
    .main-navbar .nav-link { padding:10px 12px !important; }
    .main-navbar .d-flex.align-items-center { align-items:stretch !important; flex-direction:column; gap:6px; }
    .main-navbar .dropdown, .main-navbar .dropdown > a, .main-navbar .btn-navbar-register { width:100%; }
    .store-product-grid { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .store-tabs { gap:10px; }
    .store-tab { padding:12px; }
    .api-order-card { grid-template-columns:minmax(0,1fr) auto; }
    .api-order-delivery { grid-column:1/-1; grid-row:2; }
    .api-order-message { grid-row:3; }
}
@media (max-width: 767.98px) {
    .store-hero, .store-section-head, .store-api-toolbar { align-items:stretch; flex-direction:column; gap:12px; }
    .store-history-btn { width:100%; }
    .store-tabs { grid-template-columns:1fr; }
    .store-tab { padding:10px 12px; }
    .store-tab-icon { flex-basis:38px; width:38px; height:38px; }
    .store-category-grid { grid-template-columns:1fr; gap:12px; }
    .store-category-card { min-height:150px; }
    .store-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
    .store-product-body { padding:10px; }
    .store-product-body h6 { font-size:.86rem; margin-bottom:7px; min-height:2.8em; }
    .store-product-meta { align-items:flex-start; flex-direction:column; gap:2px; margin-bottom:8px; }
    .store-product-meta strong { font-size:.9rem; }
    .store-card-action { min-height:36px; font-size:.78rem; }
    .store-provider-chip { top:6px; left:6px; max-width:calc(100% - 12px); }
    .api-order-card { grid-template-columns:1fr; gap:12px; }
    .api-order-side { align-items:stretch; flex-direction:row; flex-wrap:wrap; justify-content:space-between; }
    .api-order-delivery { grid-column:auto; grid-row:auto; }
    .api-order-message { grid-row:auto; }
}
@media (max-width: 359.98px) {
    .store-product-grid { grid-template-columns:1fr; }
}

/* Global device-fit safeguards: phone / tablet / desktop */
.container, .container-sm, .container-md, .container-lg, .container-xl, .container-xxl { max-width: 100%; }
.row > * { min-width: 0; }
.card, .xez-card, .xdvz-card, .modal-content, .dropdown-menu { overflow-wrap: anywhere; }
.table-responsive { max-width: 100%; -webkit-overflow-scrolling: touch; }
.table-responsive > .table { margin-bottom: 0; }
.form-control, .form-select, textarea, input, select { max-width: 100%; }
.modal-dialog { max-width: min(560px, calc(100vw - 24px)); margin-left: auto; margin-right: auto; }
.modal-dialog.modal-lg { max-width: min(800px, calc(100vw - 24px)); }
.modal-dialog.modal-xl { max-width: min(1140px, calc(100vw - 24px)); }
.dropdown-menu { max-width: calc(100vw - 24px); }
@media (min-width: 768px) and (max-width: 1199.98px) {
    .container, .container-sm { width: min(100%, 960px); }
}
@media (min-width: 1200px) {
    .container, .container-sm { width: min(100%, 1180px); }
}


/* V2.3.2 usability polish */
:root {
    --cy-radius-sm: 12px;
    --cy-radius-md: 18px;
    --cy-radius-lg: 24px;
    --cy-ease: cubic-bezier(.23,1,.32,1);
}

:where(a, button, input, select, textarea):focus-visible {
    outline: 3px solid rgba(14,165,233,.34);
    outline-offset: 3px;
}

.btn, .store-tab, .home-nav-card, .store-product-card, .cat-card-horizontal,
.landing-btn { transition: transform .18s var(--cy-ease), box-shadow .18s var(--cy-ease), border-color .18s var(--cy-ease), filter .18s var(--cy-ease); }
.btn:active, .landing-btn:active { transform: scale(.97); }

.main-navbar .navbar-brand { min-width: 0; }
.navbar-text-brand { max-width: 190px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.main-navbar .navbar-toggler { padding: .55rem .7rem; color: var(--cy-primary); background: rgba(56,189,248,.08); }

.home-hero-banner { position: relative; overflow: hidden; border-radius: 0 0 32px 32px; }
.home-hero-title { letter-spacing: .04em; }
.home-hero-buttons .btn { min-height: 46px; }
.home-stats-bar { border-radius: var(--cy-radius-lg); }
.home-stat-item { min-width: 0; }
.announcement-bar, .home-announcement-bar { border-radius: var(--cy-radius-md); }

.store-section-head h2, .store-section-head h3 { letter-spacing: -.02em; }
.store-search-wrap .form-control { min-height: 48px; box-shadow: 0 8px 24px rgba(15,23,42,.06); }
.store-product-card { height: 100%; }
.store-product-card:hover { transform: translateY(-4px); }
.store-card-action { margin-top: auto; }
.store-empty { background: rgba(255,255,255,.34); }
body.theme-dark .store-empty { background: rgba(15,30,50,.34); }

.product-detail-card { border-radius: var(--cy-radius-lg); }
.product-main-image { border-radius: var(--cy-radius-md); }

/* Make the landing action hierarchy clear and prevent cramped buttons on small screens. */
.landing-btn-primary { color: #fff !important; background: linear-gradient(135deg, var(--xez-primary), var(--xez-secondary)); }
.landing-btn-primary:hover { color: #fff !important; }
@media (max-width: 575.98px) {
    .landing-title { font-size: clamp(1.7rem, 9vw, 2.25rem); margin-top: 22px; }
    .landing-tagline-bar { max-width: calc(100vw - 32px); padding: 10px 18px; }
    .landing-buttons { width: min(100%, 320px); gap: 10px; }
    .landing-btn { flex: 1 1 100%; min-width: 0; padding: 16px 20px; flex-direction: row; gap: 10px; }
    .landing-btn i { margin-bottom: 0; font-size: 1.15rem; }
}

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