/* Final overrides loaded after app.css. Keep this small and intentional. */
@media (min-width: 981px) {
    .hero .hero-grid {
        grid-template-columns: minmax(500px, 520px) minmax(0, 1fr) !important;
        gap: 42px !important;
        align-items: center !important;
    }

    .hero-slider {
        width: 100% !important;
        max-width: none !important;
        justify-self: end !important;
    }

    .hero-slider-track {
        aspect-ratio: 3.55 / 1 !important;
        min-height: 0 !important;
        overflow: hidden !important;
    }
}

@media (min-width: 1500px) {
    .hero .hero-grid {
        grid-template-columns: minmax(500px, 540px) minmax(0, 1fr) !important;
    }

    .hero-slider {
        max-width: none !important;
    }
}

.hero-slider-track {
    aspect-ratio: 3.55 / 1 !important;
}

.hero-slider-track img,
.hero-slide img {
    width: 100% !important;
    height: 100% !important;
    object-fit: fill !important;
    object-position: center !important;
}

.hero-slider-track,
.hero-slide {
    background: #fff !important;
}

.partner-banner-section {
    display: block !important;
    margin-top: clamp(34px, 4vw, 52px) !important;
}

.partner-banner-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 12px !important;
}

.partner-banner-card {
    display: block !important;
    overflow: hidden !important;
    aspect-ratio: 16 / 4.8 !important;
    border: 1px solid var(--border) !important;
    border-radius: 10px !important;
    background: #fff !important;
}

.partner-banner-card img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;
}

.listing-card .card-meta {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    padding-right: 52px !important;
    min-width: 0 !important;
}

.listing-card .card-meta .card-city,
.listing-card .card-meta .card-category {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

.listing-card .card-meta .card-city {
    flex: 0 1 45% !important;
}

.listing-card .card-meta .card-category {
    flex: 1 1 auto !important;
}

.listing-card .favorite-button {
    right: 12px !important;
    bottom: 12px !important;
}

@media (max-width: 900px) {
    .partner-banner-grid {
        grid-template-columns: 1fr !important;
    }

    .listing-card .card-meta {
        grid-template-columns: 1fr !important;
    }
}

.public-wait-page {
    min-height: 100vh !important;
    padding: clamp(36px, 7vw, 96px) 18px !important;
    background: #f8fafc !important;
}

.public-wait-card {
    width: min(760px, 100%) !important;
    max-width: 760px !important;
    padding: clamp(34px, 5vw, 58px) !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.public-wait-card::before,
.public-wait-card::after,
.prelaunch-page .prelaunch-card::before,
.prelaunch-page .prelaunch-card::after {
    content: none !important;
    display: none !important;
}

.public-wait-card .maintenance-brand {
    margin-bottom: 14px !important;
}

.public-wait-card h1 {
    max-width: 620px !important;
    font-size: clamp(32px, 4.5vw, 54px) !important;
    line-height: 1.08 !important;
    text-transform: none !important;
}

.public-wait-card p {
    max-width: 560px !important;
    font-size: clamp(16px, 1.5vw, 20px) !important;
}

.public-wait-card .prelaunch-countdown {
    margin-top: 26px !important;
    margin-bottom: 26px !important;
}

.prelaunch-actions.single-action {
    justify-content: center !important;
}

.prelaunch-actions.single-action .primary-button {
    min-width: 220px !important;
}

.package-card.has-free-slot {
    border-color: rgba(21, 128, 61, .35) !important;
    background: linear-gradient(135deg, #f0fdf4, #ffffff 58%) !important;
}

.package-card .free-package-badge {
    position: static !important;
    display: inline-flex !important;
    width: fit-content !important;
    margin: 0 0 8px !important;
    padding: 5px 9px !important;
    border-radius: 999px !important;
    background: #15803d !important;
    color: #fff !important;
    font-size: 11px !important;
    font-style: normal !important;
    font-weight: 900 !important;
}

.package-card.has-free-slot .free-package-badge {
    background: linear-gradient(135deg, #15803d, #0f9f55) !important;
    box-shadow: 0 8px 16px rgba(21, 128, 61, .18) !important;
}

.package-card.has-free-slot small {
    color: #0f5132 !important;
    font-weight: 800 !important;
}

.admin-page #users .compact-scroll {
    display: grid !important;
    gap: 14px !important;
}

.admin-page #users .admin-user-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    padding: 12px !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 14px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .05) !important;
}

.admin-page #users .admin-user-card .admin-user-form {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    position: relative !important;
    padding-left: 52px !important;
}

.admin-page #users .admin-user-card .admin-avatar,
.admin-page #users .admin-user-card .admin-user-form:not(:has(.admin-avatar))::before {
    width: 38px !important;
    height: 38px !important;
    border-radius: 999px !important;
    object-fit: cover !important;
    position: absolute !important;
    left: 0 !important;
    top: 2px !important;
}

.admin-page #users .admin-user-card .admin-user-form:not(:has(.admin-avatar))::before {
    content: "U" !important;
    display: grid !important;
    place-items: center !important;
    color: #ff5a1f !important;
    background: #fff3ed !important;
    font-weight: 900 !important;
}

.admin-page #users .admin-user-card input,
.admin-page #users .admin-user-card select,
.admin-page #users .admin-user-card button {
    min-width: 0 !important;
    height: 40px !important;
}

.admin-page #users .admin-free-credit-form {
    display: grid !important;
    grid-template-columns: minmax(130px, auto) minmax(110px, 150px) minmax(140px, 180px) !important;
    align-items: end !important;
    gap: 8px !important;
    padding: 10px !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 12px !important;
    background: #f0fdf4 !important;
}

.admin-page #users .admin-free-credit-form label {
    display: grid !important;
    gap: 4px !important;
    margin: 0 !important;
}

.admin-page #users .admin-free-credit-form small {
    color: #15803d !important;
    font-size: 11px !important;
    font-weight: 900 !important;
}

.admin-page #users .admin-credit-badge {
    display: inline-flex !important;
    align-items: center !important;
    width: fit-content !important;
    padding: 6px 10px !important;
    border-radius: 999px !important;
    background: #dcfce7 !important;
    color: #15803d !important;
    font-size: 13px !important;
    font-weight: 900 !important;
}

.admin-page #users .admin-credit-input {
    width: 100% !important;
}

.admin-page #users .admin-free-credit-form .ghost-button {
    width: 100% !important;
    color: #15803d !important;
    border-color: #86efac !important;
    background: #fff !important;
}

@media (max-width: 1320px) {
    .admin-page #users .admin-user-card .admin-user-form {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .admin-page #users .admin-free-credit-form {
        grid-template-columns: auto 160px 180px !important;
        align-items: end !important;
    }
}

@media (max-width: 760px) {
    .admin-page #users .admin-user-card .admin-user-form,
    .admin-page #users .admin-free-credit-form {
        grid-template-columns: 1fr !important;
    }
}

.admin-page .partner-admin-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

.admin-page .partner-settings-panel {
    grid-column: 1 / -1 !important;
    width: 100% !important;
}

.admin-page .partner-admin-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
    padding: 10px !important;
    border-radius: 12px !important;
}

.admin-page #settings,
.admin-page #settings .admin-subpanel {
    width: 100% !important;
    max-width: none !important;
}

.admin-page .partner-admin-row > strong,
.admin-page .partner-admin-row > .compact {
    grid-column: 1 / -1 !important;
}

.admin-page .slider-admin-row {
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

.listing-form .compare-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.listing-form .compare-grid > label:nth-child(-n + 3) {
    grid-column: 1 !important;
}

.listing-form .compare-grid > label:nth-child(n + 4) {
    grid-column: 2 !important;
}

.listing-form .compare-grid > label:nth-child(1),
.listing-form .compare-grid > label:nth-child(4) {
    grid-row: 1 !important;
}

.listing-form .compare-grid > label:nth-child(2),
.listing-form .compare-grid > label:nth-child(5) {
    grid-row: 2 !important;
}

.listing-form .compare-grid > label:nth-child(3),
.listing-form .compare-grid > label:nth-child(6) {
    grid-row: 3 !important;
}

.compare-panel {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 8px !important;
}

.compare-panel[hidden] {
    display: none !important;
}

.compare-panel .compare-link {
    width: 100% !important;
    min-height: 38px !important;
    text-align: center !important;
    padding: 7px 9px !important;
    font-size: 13px !important;
    line-height: 1.25 !important;
}

.current-image-primary {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    font-size: 12px !important;
    color: #15803d !important;
}

.current-image-primary input {
    width: 16px !important;
    height: 16px !important;
    margin: 0 !important;
}

.admin-page .partner-admin-row input {
    width: 100% !important;
    min-width: 0 !important;
}

.admin-page .partner-admin-row input[type="file"] {
    height: auto !important;
    padding: 8px !important;
    font-size: 12px !important;
}

.header-logout-form {
    display: inline-flex !important;
    margin: 0 !important;
}

.header-logout-form button {
    white-space: nowrap !important;
}

.payment-settings-access {
    margin-top: 16px !important;
}

.payment-settings-access summary {
    cursor: pointer !important;
    color: #475569 !important;
    font-weight: 800 !important;
}

.payment-settings-access form {
    margin-top: 12px !important;
}

.payment-provider-tabs {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 16px !important;
}

.payment-provider-card {
    margin: 0 !important;
}

.payment-test-form {
    margin-top: -8px !important;
    margin-bottom: 16px !important;
}

.payment-provider-choice {
    display: grid !important;
    gap: 10px !important;
}

@media (max-width: 820px) {
    .payment-provider-tabs {
        grid-template-columns: 1fr !important;
    }
}

.listing-card .card-meta {
    font-size: 12px !important;
}

.listing-card .card-meta .card-city {
    flex: 0 1 auto !important;
    max-width: 45% !important;
}

.listing-card .card-meta .card-category {
    flex: 1 1 auto !important;
    min-width: 70px !important;
}

/* Card footer: show complete city and category labels without clipping. */
.listing-card .listing-body {
    position: relative !important;
}

.listing-card .card-meta {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-content: end !important;
    gap: 3px !important;
    min-height: 38px !important;
    padding-right: 48px !important;
    overflow: visible !important;
    font-size: 12px !important;
    line-height: 1.25 !important;
}

.listing-card .card-meta .card-city,
.listing-card .card-meta .card-category {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    overflow: visible !important;
    text-overflow: clip !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

.listing-card .favorite-button {
    right: 12px !important;
    bottom: 12px !important;
    z-index: 2 !important;
}

.listing-card .card-meta .card-city::before,
.listing-card .card-meta .card-category::before {
    content: none !important;
    display: none !important;
}

.listing-card .card-meta .card-city,
.listing-card .card-meta .card-category {
    padding-left: 0 !important;
    line-height: 1.3 !important;
    overflow-wrap: normal !important;
    word-break: normal !important;
}

.listing-card .card-meta .card-category {
    white-space: nowrap !important;
    font-size: 11px !important;
}

.static-text-content {
    min-width: 0 !important;
}

.faq-accordion-item {
    overflow: hidden !important;
    border: 1px solid #e5e7eb !important;
    border-radius: 10px !important;
    background: #fff !important;
    box-shadow: 0 12px 30px rgba(31, 41, 51, .045) !important;
}

.faq-accordion-item summary {
    display: grid !important;
    grid-template-columns: 38px minmax(0, 1fr) 30px !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 17px 18px !important;
    cursor: pointer !important;
    list-style: none !important;
}

.faq-accordion-item summary::-webkit-details-marker {
    display: none !important;
}

.faq-accordion-item summary i {
    display: grid !important;
    place-items: center !important;
    width: 34px !important;
    height: 34px !important;
    border-radius: 8px !important;
    background: #ecfdf3 !important;
    color: #15803d !important;
    font-style: normal !important;
    font-weight: 900 !important;
}

.faq-accordion-item summary strong {
    color: #1f2933 !important;
    font-size: 16px !important;
}

.faq-accordion-item summary > span {
    color: #ff5a1f !important;
    font-size: 24px !important;
    text-align: center !important;
    transition: transform .18s ease !important;
}

.faq-accordion-item[open] summary > span {
    transform: rotate(45deg) !important;
}

.faq-accordion-answer {
    padding: 0 60px 18px 68px !important;
    color: #64748b !important;
}

.faq-accordion-answer p {
    margin: 0 !important;
    line-height: 1.75 !important;
    white-space: normal !important;
}

.site-footer .footer-grid {
    align-items: start !important;
}

.site-footer .footer-grid > div {
    padding-top: 0 !important;
    align-self: start !important;
}

.site-footer .footer-grid h3,
.site-footer .social-title {
    margin-top: 0 !important;
    margin-bottom: 10px !important;
    line-height: 1.3 !important;
}

/* Compact, readable admin surface without changing its workflows. */
.admin-page {
    max-width: 1440px !important;
}

.admin-page .table-panel {
    padding: 18px !important;
    border-radius: 10px !important;
}

.admin-page .settings-form {
    gap: 14px !important;
}

.admin-page .admin-subpanel {
    padding: 14px !important;
    border-radius: 9px !important;
    background: #fbfcfe !important;
}

.admin-page .admin-tabs {
    position: sticky !important;
    top: 0 !important;
    z-index: 20 !important;
    background: rgba(255, 255, 255, .96) !important;
    backdrop-filter: blur(8px) !important;
}

.admin-page .admin-stats article {
    min-height: 86px !important;
    padding: 14px !important;
}

@media (max-width: 720px) {
    .faq-accordion-answer {
        padding: 0 18px 16px !important;
    }
}

@media (max-width: 720px) {
    .admin-page .partner-admin-grid {
        grid-template-columns: 1fr !important;
    }

    .admin-page .partner-admin-row,
    .admin-page .slider-admin-row,
    .listing-form .compare-grid,
    .compare-panel {
        grid-template-columns: 1fr !important;
    }

    .listing-form .compare-grid > label {
        grid-column: 1 !important;
    }
}

.current-image-card {
    cursor: pointer !important;
}

.current-image-remove {
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    width: fit-content !important;
    padding: 6px 9px !important;
    border: 1px solid #fecaca !important;
    border-radius: 999px !important;
    background: #fff7f7 !important;
    color: #b91c1c !important;
    font-size: 12px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
}

.current-image-remove-input {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 1px !important;
    height: 1px !important;
}

.current-image-remove i {
    width: 14px !important;
    height: 14px !important;
    border: 2px solid #f87171 !important;
    border-radius: 4px !important;
    background: #fff !important;
    box-sizing: border-box !important;
}

.current-image-remove-input:checked + i {
    border-color: #ef4444 !important;
    background:
        linear-gradient(45deg, transparent 48%, #fff 48%, #fff 56%, transparent 56%),
        linear-gradient(-45deg, transparent 48%, #fff 48%, #fff 56%, transparent 56%),
        #ef4444 !important;
}

.current-image-remove-input:checked ~ b {
    color: #ef4444 !important;
}

/* Qvik v5: image preview, filter panel and launch controls */
.upload-preview-panel {
    margin-top: 16px !important;
    padding: 18px !important;
    border: 1px solid rgba(255, 90, 31, .16) !important;
    border-radius: 16px !important;
    background: linear-gradient(180deg, #fff, #fffaf6) !important;
    box-shadow: 0 18px 44px rgba(15, 23, 42, .07) !important;
}

.upload-preview-head {
    align-items: center !important;
    gap: 18px !important;
    margin-bottom: 16px !important;
}

.upload-preview-head > div {
    min-width: 0;
}

.upload-preview-head strong {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #172033 !important;
    font-size: 17px !important;
}

.upload-preview-head > div > span {
    display: block;
    margin-top: 4px;
    color: #667085;
    font-size: 12px;
    line-height: 1.55;
}

.upload-preview-count {
    display: inline-flex !important;
    align-items: center;
    min-height: 25px;
    padding: 3px 9px;
    border: 1px solid rgba(255, 90, 31, .2);
    border-radius: 999px;
    background: #fff3eb;
    color: #d94a13 !important;
    font-size: 11px !important;
    font-weight: 1000;
}

.upload-clear-button {
    flex: 0 0 auto;
    min-height: 38px;
    padding: 0 13px;
    border: 1px solid #e5e7eb;
    border-radius: 10px;
    background: #fff;
    color: #475467;
    font-size: 12px;
    font-weight: 900;
    cursor: pointer;
    transition: border-color .18s ease, color .18s ease, box-shadow .18s ease;
}

.upload-clear-button:hover {
    border-color: rgba(239, 68, 68, .28);
    color: #dc2626;
    box-shadow: 0 10px 24px rgba(15, 23, 42, .08);
}

.listing-form .upload-field {
    padding: 18px !important;
    border: 1.5px dashed rgba(255, 90, 31, .35) !important;
    border-radius: 16px !important;
    background: linear-gradient(135deg, #fffaf5, #fff) !important;
}

.upload-field-title {
    color: #172033;
    font-size: 15px;
    font-weight: 1000;
}

.listing-form .upload-field input[type="file"] {
    padding: 12px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 11px !important;
    background: #fff !important;
}

.upload-preview-grid {
    grid-template-columns: repeat(auto-fill, minmax(176px, 1fr)) !important;
    gap: 14px !important;
}

.upload-preview-card {
    min-height: 236px !important;
    overflow: hidden;
    border: 1px solid #e4e7ec !important;
    border-radius: 15px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .075) !important;
}

.upload-preview-card:hover {
    transform: translateY(-2px) !important;
    border-color: rgba(255, 90, 31, .3) !important;
    box-shadow: 0 18px 38px rgba(15, 23, 42, .1) !important;
}

.upload-preview-media {
    position: relative;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    background:
        linear-gradient(45deg, #f8fafc 25%, transparent 25%),
        linear-gradient(-45deg, #f8fafc 25%, transparent 25%),
        linear-gradient(45deg, transparent 75%, #f8fafc 75%),
        linear-gradient(-45deg, transparent 75%, #f8fafc 75%);
    background-size: 18px 18px;
    background-position: 0 0, 0 9px, 9px -9px, -9px 0;
}

.upload-preview-card img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    background: transparent !important;
}

.upload-preview-card.has-preview-error .upload-preview-media::after {
    content: "წინასწარი ნახვა ვერ ჩაიტვირთა";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 16px;
    background: #fff7ed;
    color: #9a3412;
    text-align: center;
    font-size: 12px;
    font-weight: 900;
}

.upload-preview-badge {
    position: absolute !important;
    top: 10px !important;
    left: 10px !important;
    padding: 6px 10px !important;
    border: 1px solid rgba(255, 255, 255, .42);
    border-radius: 999px !important;
    background: rgba(255, 90, 31, .94) !important;
    box-shadow: 0 8px 18px rgba(122, 47, 16, .18);
    color: #fff !important;
    font-size: 11px !important;
    backdrop-filter: blur(8px);
}

.upload-preview-meta {
    min-width: 0;
    padding: 11px 12px 42px;
}

.upload-preview-meta strong {
    display: block;
    overflow: hidden;
    color: #344054;
    font-size: 12px;
    font-weight: 900;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.upload-preview-meta small {
    display: block !important;
    padding: 3px 0 0 !important;
    color: #98a2b3 !important;
    font-size: 11px !important;
    font-weight: 800 !important;
}

.upload-preview-controls {
    left: 10px !important;
    bottom: 10px !important;
    gap: 6px !important;
}

.upload-preview-controls button,
.upload-preview-remove {
    width: 29px !important;
    height: 29px !important;
    border: 1px solid #e4e7ec !important;
    box-shadow: 0 7px 16px rgba(15, 23, 42, .1) !important;
}

.upload-preview-controls button:first-child {
    color: #f59e0b;
}

.upload-preview-remove {
    right: 10px !important;
    bottom: 10px !important;
    background: #fff5f5 !important;
    color: #dc2626 !important;
}

.upload-preview-card::after {
    display: none !important;
}

/* Softer, more premium search/filter box */
.market-filters {
    position: relative;
    overflow: hidden;
    padding: 16px !important;
    gap: 10px !important;
    border: 0 !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 100% 0, rgba(255, 90, 31, .10), transparent 32%),
        linear-gradient(135deg, #ffffff 0%, #fbfdff 62%, #fff8f2 100%) !important;
    box-shadow:
        0 20px 48px rgba(15, 23, 42, .085),
        inset 0 0 0 1px rgba(226, 232, 240, .82) !important;
}

.market-filters::before {
    content: "";
    position: absolute;
    top: 0;
    left: 18px;
    right: 18px;
    height: 3px;
    border-radius: 0 0 999px 999px;
    background: linear-gradient(90deg, #ff5a1f, #ff9c6b 55%, rgba(255, 156, 107, 0));
}

.filter-panel-heading {
    grid-column: 1 / -1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 2px 2px 5px;
}

.filter-panel-heading > div {
    min-width: 0;
}

.filter-panel-heading strong {
    display: block;
    color: #172033;
    font-size: 15px;
    font-weight: 1000;
}

.filter-panel-heading span:not(.filter-panel-badge) {
    display: block;
    margin-top: 3px;
    color: #667085;
    font-size: 12px;
    line-height: 1.45;
}

.filter-panel-badge {
    flex: 0 0 auto;
    max-width: 240px;
    overflow: hidden;
    padding: 7px 11px;
    border: 1px solid rgba(255, 90, 31, .18);
    border-radius: 999px;
    background: rgba(255, 255, 255, .88);
    color: #d94a13;
    font-size: 11px;
    font-weight: 1000;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.market-filters label {
    display: grid;
    align-content: end;
    gap: 6px;
    padding: 10px;
    border: 1px solid rgba(226, 232, 240, .86);
    border-radius: 12px;
    background: rgba(255, 255, 255, .86);
    color: #667085;
    font-size: 11px;
    font-weight: 1000;
    transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}

.market-filters label:focus-within {
    transform: translateY(-1px);
    border-color: rgba(255, 90, 31, .34);
    box-shadow: 0 10px 24px rgba(255, 90, 31, .075);
}

.market-filters input,
.market-filters select {
    min-height: 42px !important;
    margin: 0 !important;
    padding: 0 11px !important;
    border: 1px solid #e4e7ec !important;
    border-radius: 9px !important;
    background-color: #fff !important;
    box-shadow: none !important;
    color: #172033;
    font-size: 13px;
    font-weight: 800;
}

.market-filters input:focus,
.market-filters select:focus {
    border-color: rgba(255, 90, 31, .58) !important;
    box-shadow: 0 0 0 3px rgba(255, 90, 31, .09) !important;
    outline: 0;
}

.market-filters > .primary-button {
    align-self: stretch;
    min-height: 64px !important;
    border-radius: 12px !important;
    box-shadow: 0 14px 28px rgba(255, 90, 31, .22) !important;
}

.market-filters:focus-within {
    border-color: transparent !important;
    box-shadow:
        0 22px 52px rgba(15, 23, 42, .1),
        inset 0 0 0 1px rgba(255, 90, 31, .16) !important;
}

/* Launch panel redesigned as a clear operational control */
.launch-admin-panel {
    position: relative;
    overflow: hidden;
    padding: 20px !important;
    border: 0 !important;
    border-radius: 18px !important;
    background:
        radial-gradient(circle at 100% 0, rgba(255, 90, 31, .13), transparent 35%),
        linear-gradient(135deg, #fff 0%, #fff9f4 58%, #f4fbff 100%) !important;
    box-shadow:
        0 20px 48px rgba(15, 23, 42, .08),
        inset 0 0 0 1px rgba(226, 232, 240, .9) !important;
}

.launch-admin-panel::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 4px;
    background: linear-gradient(90deg, #ff5a1f, #ff9a62 55%, #22c55e);
}

.launch-admin-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: start;
    gap: 14px;
    margin-bottom: 16px;
}

.launch-admin-icon {
    display: grid;
    place-items: center;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    background: #fff;
    box-shadow: 0 12px 26px rgba(15, 23, 42, .09);
    font-size: 22px;
}

.launch-admin-eyebrow {
    color: #d94a13;
    font-size: 10px;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.launch-admin-head h3 {
    margin: 3px 0 5px !important;
    color: #172033;
    font-size: 21px !important;
}

.launch-admin-head p {
    max-width: 760px;
    margin: 0;
    color: #667085;
    font-size: 13px;
    line-height: 1.6;
}

.launch-status-chip {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    padding: 0 11px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 1000;
    white-space: nowrap;
}

.launch-status-chip.is-waiting {
    border: 1px solid rgba(245, 158, 11, .25);
    background: #fffbeb;
    color: #b45309;
}

.launch-status-chip.is-live {
    border: 1px solid rgba(34, 197, 94, .25);
    background: #ecfdf3;
    color: #15803d;
}

.launch-toggle-card {
    display: flex !important;
    align-items: flex-start;
    gap: 11px;
    margin: 0 0 14px;
    padding: 14px 15px;
    border: 1px solid rgba(255, 90, 31, .16);
    border-radius: 13px;
    background: rgba(255, 255, 255, .82);
}

.launch-toggle-card input {
    flex: 0 0 auto;
    width: 19px;
    height: 19px;
    margin: 1px 0 0 !important;
    accent-color: #ff5a1f;
}

.launch-toggle-card span {
    display: grid;
    gap: 3px;
}

.launch-toggle-card strong {
    color: #344054;
    font-size: 13px;
}

.launch-toggle-card small {
    color: #667085;
    font-size: 11px;
    line-height: 1.5;
}

.launch-admin-fields {
    display: grid;
    grid-template-columns: 1.05fr 1fr 1.2fr;
    gap: 11px;
}

.launch-admin-fields label {
    display: grid;
    gap: 6px;
    padding: 12px;
    border: 1px solid #e4e7ec;
    border-radius: 12px;
    background: rgba(255, 255, 255, .9);
}

.launch-admin-fields label > span {
    color: #667085;
    font-size: 11px;
    font-weight: 1000;
}

.launch-admin-fields input {
    min-width: 0;
    min-height: 43px;
    margin: 0 !important;
    border-radius: 9px !important;
}

.launch-admin-fields small {
    color: #98a2b3;
    font-size: 10px;
    line-height: 1.45;
}

.launch-admin-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 11px;
    margin-top: 14px;
}

.launch-action-button {
    display: grid;
    gap: 4px;
    min-height: 72px;
    padding: 13px 15px;
    border-radius: 13px;
    text-align: left;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.launch-action-button:hover {
    transform: translateY(-2px);
}

.launch-action-button span {
    font-size: 14px;
    font-weight: 1000;
}

.launch-action-button small {
    font-size: 10px;
    font-weight: 800;
    line-height: 1.45;
}

.prelaunch-action {
    border: 1px solid #d0d5dd;
    background: #fff;
    color: #344054;
    box-shadow: 0 12px 26px rgba(15, 23, 42, .07);
}

.prelaunch-action small {
    color: #667085;
}

.live-action {
    border: 1px solid #ff5a1f;
    background: linear-gradient(135deg, #ff5a1f, #ff7b43);
    color: #fff;
    box-shadow: 0 16px 34px rgba(255, 90, 31, .24);
}

.live-action small {
    color: rgba(255, 255, 255, .85);
}

.launch-admin-note {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    margin-top: 12px;
    padding: 11px 13px;
    border: 1px solid rgba(34, 197, 94, .18);
    border-radius: 11px;
    background: rgba(236, 253, 243, .86);
    color: #166534;
    font-size: 11px;
    line-height: 1.5;
}

.launch-admin-note strong {
    flex: 0 0 auto;
}

.launch-countdown-numbers.is-launching {
    animation: qvikLaunchPulse .8s ease-in-out infinite alternate;
}

@keyframes qvikLaunchPulse {
    from { transform: scale(1); box-shadow: 0 0 0 rgba(255, 90, 31, 0); }
    to { transform: scale(1.025); box-shadow: 0 12px 30px rgba(255, 90, 31, .16); }
}

@media (max-width: 900px) {
    .launch-admin-fields {
        grid-template-columns: 1fr;
    }

    .launch-admin-head {
        grid-template-columns: auto 1fr;
    }

    .launch-status-chip {
        grid-column: 1 / -1;
        width: max-content;
    }
}

@media (max-width: 680px) {
    .upload-preview-head,
    .filter-panel-heading {
        align-items: stretch !important;
        flex-direction: column;
    }

    .upload-clear-button,
    .filter-panel-badge {
        width: 100%;
        max-width: none;
        text-align: center;
    }

    .upload-preview-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .upload-preview-card {
        min-height: 210px !important;
    }

    .launch-admin-actions {
        grid-template-columns: 1fr;
    }

    .launch-admin-panel {
        padding: 16px !important;
    }
}

@media (max-width: 430px) {
    .upload-preview-grid {
        grid-template-columns: 1fr !important;
    }
}


/* v6: package-specific admin credits and branding/favicon */
.admin-package-credit-summary { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-package-credit-summary span { padding: 5px 8px; border: 1px solid #e4e7ec; border-radius: 999px; background: #f9fafb; color: #475467; font-size: 10px; font-weight: 900; }
.package-credit-controls { display: grid !important; grid-template-columns: minmax(130px, 1fr) 72px auto; gap: 7px; }
.package-credit-controls select, .package-credit-controls input { min-width: 0; margin: 0 !important; }
.branding-admin-form { display: grid; gap: 18px; }
.branding-preview-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.branding-preview-card { display: grid; gap: 12px; padding: 18px; border: 1px solid #e4e7ec; border-radius: 16px; background: #fff; }
.branding-preview-card > span { color: #344054; font-size: 13px; font-weight: 1000; }
.branding-preview-canvas { display: grid; place-items: center; min-height: 118px; border: 1px dashed #d0d5dd; border-radius: 14px; background: #f9fafb; }
.branding-preview-canvas img { max-width: 190px; max-height: 86px; object-fit: contain; }
.browser-tab-preview { display: flex; align-items: center; gap: 9px; min-height: 54px; padding: 10px 12px; border: 1px solid #d0d5dd; border-radius: 12px 12px 5px 5px; background: #f2f4f7; color: #344054; box-shadow: inset 0 -1px 0 #fff; }
.browser-tab-preview img { width: 24px; height: 24px; border-radius: 6px; object-fit: cover; }
.browser-tab-preview strong { flex: 1; font-size: 12px; }
.browser-tab-preview i { color: #98a2b3; font-style: normal; }
@media (max-width: 760px) { .branding-preview-grid { grid-template-columns: 1fr; } .package-credit-controls { grid-template-columns: 1fr 72px; } .package-credit-controls button { grid-column: 1 / -1; } }


/* v7: basic registration, integrated category selector, persistent demo switch */
.search-panel {
    gap: 0 !important;
    padding: 6px !important;
    border: 1px solid rgba(15, 23, 42, .09) !important;
    border-radius: 18px !important;
    background: rgba(255, 255, 255, .98) !important;
    box-shadow: 0 16px 38px rgba(15, 23, 42, .10) !important;
}

.search-panel label {
    position: relative;
    display: grid !important;
    align-content: center;
    gap: 3px !important;
    min-height: 58px;
    padding: 7px 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.search-panel .search-field,
.search-panel .search-category-field {
    border-right: 1px solid #edf0f4 !important;
}

.search-panel label > span {
    color: #98a2b3 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    letter-spacing: .02em;
}

.search-panel input,
.search-panel select {
    width: 100% !important;
    min-height: 30px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    outline: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #344054 !important;
    font-size: 13px !important;
    font-weight: 850 !important;
}

.search-panel input:focus,
.search-panel select:focus {
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.search-panel .search-category-field {
    flex: 0 0 190px !important;
    min-width: 190px !important;
    padding-right: 38px !important;
}

.search-panel .search-category-field::after {
    content: "";
    position: absolute;
    right: 16px;
    bottom: 21px;
    width: 7px;
    height: 7px;
    border-right: 2px solid #667085;
    border-bottom: 2px solid #667085;
    transform: rotate(45deg);
    pointer-events: none;
}

.search-panel .search-category-field select {
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

.search-panel .primary-button {
    align-self: stretch !important;
    min-height: 58px !important;
    margin-left: 6px !important;
    border-radius: 13px !important;
    box-shadow: 0 12px 24px rgba(255, 90, 31, .22) !important;
}

.demo-visibility-card {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    margin: 0 0 18px;
    padding: 18px 20px;
    border: 1px solid #e4e7ec;
    border-radius: 16px;
    background: linear-gradient(135deg, #fff 0%, #f8fafc 100%);
    box-shadow: 0 14px 34px rgba(15, 23, 42, .06);
}

.demo-visibility-card.is-enabled {
    border-color: rgba(34, 197, 94, .30);
    background: linear-gradient(135deg, #f0fdf4, #fff 72%);
}

.demo-visibility-card.is-disabled {
    border-color: rgba(148, 163, 184, .30);
}

.demo-visibility-copy {
    display: grid;
    gap: 5px;
}

.demo-visibility-eyebrow {
    color: #ff5a1f;
    font-size: 10px;
    font-weight: 1000;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.demo-visibility-copy strong {
    color: #172033;
    font-size: 17px;
}

.demo-visibility-copy p {
    max-width: 760px;
    margin: 0;
    color: #667085;
    font-size: 11px;
    line-height: 1.55;
}

.demo-visibility-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    justify-content: flex-end;
}

.demo-toggle-button {
    min-height: 43px;
    padding: 0 14px;
    border: 1px solid #d0d5dd;
    border-radius: 11px;
    background: #fff;
    color: #475467;
    font-size: 11px;
    font-weight: 1000;
    cursor: pointer;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.demo-toggle-button:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 22px rgba(15, 23, 42, .08);
}

.enable-demo.is-current,
.enable-demo:hover {
    border-color: #22c55e;
    background: #16a34a;
    color: #fff;
}

.disable-demo.is-current,
.disable-demo:hover {
    border-color: #475467;
    background: #344054;
    color: #fff;
}

@media (max-width: 760px) {
    .search-panel {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 0 !important;
        padding: 6px !important;
    }

    .search-panel .search-field,
    .search-panel .search-category-field {
        width: 100% !important;
        min-width: 0 !important;
        border-right: 0 !important;
        border-bottom: 1px solid #edf0f4 !important;
    }

    .search-panel .primary-button {
        width: 100% !important;
        margin: 6px 0 0 !important;
    }

    .demo-visibility-card {
        grid-template-columns: 1fr;
        align-items: stretch;
    }

    .demo-visibility-actions {
        justify-content: stretch;
    }

    .demo-toggle-button {
        flex: 1 1 150px;
    }
}

/* v7.1: one-piece home search field — the category value has no inner box */
.search-panel .search-category-field {
    position: relative !important;
    display: grid !important;
    align-content: center !important;
    gap: 3px !important;
    flex: 0 0 190px !important;
    min-width: 190px !important;
    min-height: 58px !important;
    padding: 7px 40px 7px 16px !important;
    border: 0 !important;
    border-right: 1px solid #edf0f4 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

.search-panel .search-category-field > span {
    color: #98a2b3 !important;
    font-size: 10px !important;
    font-weight: 900 !important;
    line-height: 1.2 !important;
    letter-spacing: .02em !important;
}

.search-panel .search-category-field select {
    all: unset !important;
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    color: #344054 !important;
    font-family: inherit !important;
    font-size: 13px !important;
    font-weight: 850 !important;
    line-height: 30px !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
    cursor: pointer !important;
}

.search-panel .search-category-field::after {
    right: 18px !important;
    bottom: 22px !important;
}

@media (max-width: 760px) {
    .search-panel .search-category-field {
        flex-basis: auto !important;
        min-width: 0 !important;
        width: 100% !important;
        border-right: 0 !important;
        border-bottom: 1px solid #edf0f4 !important;
    }
}

/* v8: clean real-user management cards */
.admin-page #users.admin-users-panel {
    overflow: hidden;
}

.admin-page #users .admin-users-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 12px;
}

.admin-page #users .admin-users-heading h2,
.admin-page #users .admin-users-heading p {
    margin: 0;
}

.admin-page #users .admin-users-heading p {
    margin-top: 5px;
    color: #667085;
    font-size: 12px;
}

.admin-page #users .admin-users-count {
    flex: 0 0 auto;
    padding: 8px 12px;
    border: 1px solid #fed7c7;
    border-radius: 999px;
    background: #fff6f1;
    color: #e94d13;
    font-size: 12px;
    font-weight: 900;
}

.admin-page #users .admin-users-list {
    display: grid !important;
    gap: 16px !important;
    max-height: 780px !important;
    padding-right: 6px !important;
}

.admin-page #users .admin-user-card {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 16px !important;
    border: 1px solid #e7eaf0 !important;
    border-radius: 18px !important;
    background: #fff !important;
    box-shadow: 0 12px 28px rgba(15, 23, 42, .055) !important;
}

.admin-page #users .admin-user-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid #eef1f5;
}

.admin-page #users .admin-user-identity,
.admin-page #users .admin-user-badges,
.admin-page #users .admin-package-credit-summary,
.admin-page #users .admin-credit-controls {
    display: flex;
    align-items: center;
}

.admin-page #users .admin-user-identity {
    gap: 11px;
    min-width: 0;
}

.admin-page #users .admin-user-identity > div {
    display: grid;
    min-width: 0;
    gap: 3px;
}

.admin-page #users .admin-user-identity strong,
.admin-page #users .admin-user-identity small {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.admin-page #users .admin-user-identity strong {
    color: #172033;
    font-size: 15px;
}

.admin-page #users .admin-user-identity small {
    color: #7a8494;
    font-size: 11px;
}

.admin-page #users .admin-avatar {
    position: static !important;
    flex: 0 0 44px;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    border: 1px solid #fed7c7;
    background: #fff6f1;
}

.admin-page #users .admin-avatar-fallback {
    display: grid;
    place-items: center;
    color: #ff5a1f;
    font-size: 15px;
    font-weight: 1000;
}

.admin-page #users .admin-user-badges {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 6px;
}

.admin-page #users .admin-user-role,
.admin-page #users .admin-user-status {
    padding: 6px 9px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 1000;
    text-transform: uppercase;
}

.admin-page #users .admin-user-role {
    color: #344054;
    background: #f2f4f7;
}

.admin-page #users .admin-user-status.is-active {
    color: #067647;
    background: #ecfdf3;
}

.admin-page #users .admin-user-status.is-blocked {
    color: #b42318;
    background: #fef3f2;
}

.admin-page #users .admin-user-editor {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px !important;
    padding: 0 !important;
    position: static !important;
}

.admin-page #users .admin-user-editor::before {
    content: none !important;
    display: none !important;
}

.admin-page #users .admin-user-editor label {
    display: grid;
    gap: 5px;
    min-width: 0;
    margin: 0;
    color: #475467;
    font-size: 11px;
    font-weight: 900;
}

.admin-page #users .admin-user-editor input,
.admin-page #users .admin-user-editor select {
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    padding: 0 12px !important;
    border: 1px solid #dfe3ea !important;
    border-radius: 10px !important;
    background: #fff !important;
    color: #172033 !important;
}

.admin-page #users .admin-user-editor input[type="file"] {
    height: auto !important;
    min-height: 42px !important;
    padding: 8px 10px !important;
}

.admin-page #users .admin-user-wide {
    grid-column: 1 / -1 !important;
}

.admin-page #users .admin-user-actions {
    display: flex;
    justify-content: flex-end;
}

.admin-page #users .admin-user-actions .primary-button {
    width: auto !important;
    min-width: 190px;
    min-height: 42px;
}

.admin-page #users .admin-free-credit-form {
    display: grid !important;
    grid-template-columns: minmax(190px, 1fr) auto minmax(320px, auto) !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 13px !important;
    border: 1px solid #bbf7d0 !important;
    border-radius: 14px !important;
    background: linear-gradient(135deg, #f0fdf4, #fff) !important;
}

.admin-page #users .admin-credit-copy {
    display: grid;
    gap: 3px;
}

.admin-page #users .admin-credit-copy strong {
    color: #166534;
    font-size: 12px;
}

.admin-page #users .admin-credit-copy small {
    color: #4b7b5a;
    font-size: 10px;
    line-height: 1.45;
}

.admin-page #users .admin-package-credit-summary {
    flex-wrap: wrap;
    gap: 6px;
}

.admin-page #users .admin-package-credit-summary span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 6px 9px;
    border-radius: 999px;
    background: #dcfce7;
    color: #166534;
    font-size: 10px;
    font-weight: 900;
}

.admin-page #users .admin-package-credit-summary b {
    min-width: 18px;
    text-align: center;
}

.admin-page #users .admin-credit-controls {
    justify-content: flex-end;
    gap: 8px;
}

.admin-page #users .admin-credit-controls select {
    min-width: 150px !important;
}

.admin-page #users .admin-credit-controls input {
    width: 72px !important;
}

.admin-page #users .admin-credit-controls button {
    white-space: nowrap;
}

.admin-page #users .admin-empty-state {
    margin: 0;
    padding: 24px;
    border: 1px dashed #d0d5dd;
    border-radius: 14px;
    text-align: center;
    color: #667085;
}

@media (max-width: 1050px) {
    .admin-page #users .admin-free-credit-form {
        grid-template-columns: 1fr !important;
        align-items: stretch !important;
    }

    .admin-page #users .admin-credit-controls {
        justify-content: stretch;
    }

    .admin-page #users .admin-credit-controls select,
    .admin-page #users .admin-credit-controls button {
        flex: 1 1 auto;
    }
}

@media (max-width: 680px) {
    .admin-page #users .admin-users-heading,
    .admin-page #users .admin-user-card-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-page #users .admin-user-badges {
        justify-content: flex-start;
    }

    .admin-page #users .admin-user-editor {
        grid-template-columns: 1fr !important;
    }

    .admin-page #users .admin-user-wide {
        grid-column: auto !important;
    }

    .admin-page #users .admin-user-actions,
    .admin-page #users .admin-user-actions .primary-button {
        width: 100% !important;
    }

    .admin-page #users .admin-credit-controls {
        display: grid;
        grid-template-columns: 1fr 82px;
    }

    .admin-page #users .admin-credit-controls button {
        grid-column: 1 / -1;
        width: 100%;
    }
}


/* v9: privacy-friendly unique visitor dashboard */
.admin-page .visitor-analytics-panel {
    margin: 18px 0 24px;
    padding: 22px;
    border: 1px solid #d9e4ff;
    border-radius: 20px;
    background:
        radial-gradient(circle at top right, rgba(255, 90, 31, .12), transparent 34%),
        linear-gradient(145deg, #f8fbff, #ffffff 62%);
    box-shadow: 0 16px 42px rgba(35, 52, 88, .08);
    scroll-margin-top: 20px;
}

.admin-page .visitor-analytics-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

.admin-page .visitor-analytics-heading h2,
.admin-page .visitor-analytics-heading p {
    margin: 0;
}

.admin-page .visitor-analytics-heading h2 {
    margin-top: 4px;
    color: #172033;
    font-size: clamp(22px, 3vw, 31px);
}

.admin-page .visitor-analytics-heading p {
    margin-top: 6px;
    max-width: 720px;
    color: #667085;
    font-size: 13px;
    line-height: 1.55;
}

.admin-page .visitor-analytics-eyebrow,
.admin-page .visitor-year-note {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: 5px 10px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 1000;
    letter-spacing: .04em;
    text-transform: uppercase;
}

.admin-page .visitor-analytics-eyebrow {
    color: #175cd3;
    background: #eff8ff;
}

.admin-page .visitor-year-note {
    flex: 0 0 auto;
    color: #b54708;
    background: #fffaeb;
}

.admin-page .visitor-stat-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.admin-page .visitor-stat-grid article {
    position: relative;
    overflow: hidden;
    min-height: 138px;
    padding: 17px;
    border: 1px solid #e4e7ec;
    border-radius: 16px;
    background: rgba(255, 255, 255, .92);
}

.admin-page .visitor-stat-grid article::after {
    content: '';
    position: absolute;
    right: -24px;
    bottom: -34px;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    background: rgba(23, 92, 211, .08);
}

.admin-page .visitor-stat-grid .visitor-year-card::after {
    background: rgba(255, 90, 31, .13);
}

.admin-page .visitor-stat-grid span,
.admin-page .visitor-stat-grid strong,
.admin-page .visitor-stat-grid small {
    position: relative;
    z-index: 1;
    display: block;
}

.admin-page .visitor-stat-grid span {
    color: #475467;
    font-size: 12px;
    font-weight: 900;
}

.admin-page .visitor-stat-grid strong {
    margin: 12px 0 7px;
    color: #172033;
    font-size: clamp(30px, 4vw, 44px);
    line-height: 1;
}

.admin-page .visitor-stat-grid small {
    color: #667085;
    font-size: 10px;
    line-height: 1.4;
}

/* v9: destructive user action is deliberately separated from editing */
.admin-page #users .admin-user-delete-zone {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 13px;
    border: 1px solid #fecdca;
    border-radius: 14px;
    background: #fff7f6;
}

.admin-page #users .admin-user-delete-zone > div {
    display: grid;
    gap: 3px;
}

.admin-page #users .admin-user-delete-zone strong {
    color: #b42318;
    font-size: 12px;
}

.admin-page #users .admin-user-delete-zone small {
    color: #912018;
    font-size: 10px;
    line-height: 1.45;
}

.admin-page #users .admin-user-delete-button {
    min-height: 40px;
    white-space: nowrap;
}

.admin-page #users .admin-user-delete-locked {
    flex: 0 0 auto;
    padding: 8px 11px;
    border-radius: 999px;
    color: #475467;
    background: #eaecf0;
    font-size: 10px;
    font-weight: 900;
}

@media (max-width: 980px) {
    .admin-page .visitor-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .admin-page .visitor-analytics-heading,
    .admin-page #users .admin-user-delete-zone {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-page .visitor-year-note,
    .admin-page #users .admin-user-delete-locked,
    .admin-page #users .admin-user-delete-zone form,
    .admin-page #users .admin-user-delete-button {
        width: 100%;
    }

    .admin-page .visitor-year-note,
    .admin-page #users .admin-user-delete-locked {
        justify-content: center;
        text-align: center;
    }

    .admin-page .visitor-stat-grid {
        grid-template-columns: 1fr;
    }
}

/* v10: wider user management, compact categories and explicit password controls */
.admin-page .admin-directory-layout {
    display: grid !important;
    grid-template-columns: minmax(250px, .72fr) minmax(0, 1.85fr) !important;
    align-items: start !important;
    gap: 18px !important;
}

.admin-page .admin-directory-layout > * {
    min-width: 0;
}

.admin-page #categories.admin-categories-panel {
    padding: 16px !important;
}

.admin-page #categories .admin-panel-tools,
.admin-page #categories > .inline-form {
    width: 100%;
}

.admin-page #categories > .inline-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    gap: 8px !important;
    margin-bottom: 12px;
}

.admin-page #categories > .inline-form input {
    min-width: 0 !important;
    width: 100% !important;
}

.admin-page #categories .admin-scroll-panel {
    max-height: 720px !important;
    padding-right: 5px !important;
}

.admin-page #categories .admin-filter-item {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 8px !important;
    padding: 10px !important;
}

.admin-page #categories .category-row {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    gap: 7px !important;
    width: 100% !important;
}

.admin-page #categories .category-row input[name="name"] {
    min-width: 0 !important;
    width: 100% !important;
}

.admin-page #categories .category-row .compact {
    display: inline-flex !important;
    align-items: center !important;
    gap: 5px !important;
    min-width: max-content;
    padding: 0 2px;
    font-size: 10px !important;
    white-space: nowrap;
}

.admin-page #categories .category-row button {
    min-width: 42px !important;
    padding-inline: 10px !important;
}

.admin-page #categories .category-delete-row {
    width: 100% !important;
}

.admin-page #categories .category-delete-row .danger-button {
    width: 100% !important;
    min-height: 35px !important;
    border-color: #fecdca !important;
    background: #fff7f6 !important;
    color: #b42318 !important;
    font-size: 10px !important;
}

.admin-page #users.admin-users-panel {
    min-width: 0;
    padding: 18px !important;
}

.admin-page #users .admin-users-list {
    overflow-x: hidden !important;
    max-height: 850px !important;
}

.admin-page #users .admin-user-card {
    min-width: 0;
}

.admin-page #users .admin-user-editor {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

.admin-page #users .admin-user-security-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 12px;
}

.admin-page #users .admin-password-reset-form {
    display: grid;
    gap: 12px;
    padding: 14px;
    border: 1px solid #c7d7fe;
    border-radius: 15px;
    background: linear-gradient(135deg, #f7faff, #fff);
}

.admin-page #users .admin-password-reset-copy {
    display: grid;
    gap: 3px;
}

.admin-page #users .admin-password-reset-copy strong {
    color: #1849a9;
    font-size: 12px;
}

.admin-page #users .admin-password-reset-copy small {
    color: #475467;
    font-size: 10px;
    line-height: 1.5;
}

.admin-page #users .admin-password-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.admin-page #users .admin-password-fields label {
    display: grid;
    gap: 5px;
    margin: 0;
    min-width: 0;
    color: #475467;
    font-size: 11px;
    font-weight: 900;
}

.admin-page #users .admin-password-fields input {
    width: 100%;
    min-width: 0;
    height: 42px;
    padding: 0 12px;
    border: 1px solid #b9c9f8;
    border-radius: 10px;
    background: #fff;
    color: #172033;
}

.admin-page #users .admin-password-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    flex-wrap: wrap;
}

.admin-page #users .admin-password-actions button {
    min-height: 40px;
}

.admin-page #users .admin-generated-password {
    display: block;
    overflow-wrap: anywhere;
    padding: 10px 12px;
    border: 1px dashed #84adff;
    border-radius: 10px;
    background: #eff4ff;
    color: #1849a9;
    font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 11px;
    font-weight: 800;
    user-select: all;
}

.admin-page #users .admin-generated-password[hidden] {
    display: none !important;
}

.dashboard .profile-security-form {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid #eaecf0;
}

.dashboard .profile-security-heading {
    display: grid;
    gap: 3px;
    margin-bottom: 4px;
}

.dashboard .profile-security-heading strong {
    color: #172033;
    font-size: 14px;
}

.dashboard .profile-security-heading small {
    color: #667085;
    font-size: 11px;
    line-height: 1.45;
}

@media (min-width: 1450px) {
    .admin-page #users .admin-user-editor {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    }

    .admin-page #users .admin-user-wide {
        grid-column: span 2 !important;
    }

    .admin-page #users .admin-user-actions {
        grid-column: 3 !important;
        align-items: end;
    }
}

@media (max-width: 1080px) {
    .admin-page .admin-directory-layout {
        grid-template-columns: 1fr !important;
    }

    .admin-page #categories .admin-scroll-panel {
        max-height: 460px !important;
    }
}

@media (max-width: 720px) {
    .admin-page #categories .category-row,
    .admin-page #users .admin-password-fields {
        grid-template-columns: 1fr !important;
    }

    .admin-page #categories .category-row .compact {
        justify-content: flex-start;
    }

    .admin-page #users .admin-password-actions,
    .admin-page #users .admin-password-actions button {
        width: 100%;
    }
}