@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');

:root {
    --ta-primary: #3c50e0;
    --ta-primary-dark: #2e3fbf;
    --ta-secondary: #80caee;
    --ta-success: #219653;
    --ta-danger: #d34053;
    --ta-warning: #ffa70b;
    --ta-sidebar: #1c2434;
    --ta-sidebar-hover: #333a48;
    --ta-body: #f1f5f9;
    --ta-stroke: #e2e8f0;
    --ta-text: #64748b;
    --ta-title: #1c2434;
    --ta-meta: #8a99af;
}

html, body, .fi-body, .fi-font-sans {
    font-family: 'Inter', ui-sans-serif, system-ui, sans-serif !important;
}

/* Scrollbars */
.fi-sidebar nav::-webkit-scrollbar { width: 4px; }
.fi-sidebar nav::-webkit-scrollbar-thumb { background: rgba(255,255,255,.15); border-radius: 4px; }
.fi-main::-webkit-scrollbar { width: 6px; }
.fi-main::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 6px; }

/* Body */
.fi-body,
.fi-main,
.fi-page {
    background: var(--ta-body) !important;
}

.fi-main {
    padding-bottom: 2rem !important;
}

.fi-page-header {
    margin-bottom: 1rem !important;
}

.fi-header {
    gap: 0.75rem !important;
}

.fi-header-heading {
    color: var(--ta-title) !important;
    font-weight: 700 !important;
    font-size: 1.375rem !important;
    letter-spacing: -0.01em;
    line-height: 1.25 !important;
    margin: 0 !important;
}

.fi-header-breadcrumbs,
.fi-breadcrumbs {
    margin: 0 !important;
    line-height: 1.2 !important;
}

.fi-breadcrumbs-list {
    gap: 0.25rem !important;
}

.fi-breadcrumbs-item {
    gap: 0.25rem !important;
}

.fi-breadcrumbs-item-label {
    color: var(--ta-meta) !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
}

.fi-breadcrumbs-item-separator {
    width: 0.75rem !important;
    height: 0.75rem !important;
    color: var(--ta-meta) !important;
}

.fi-breadcrumbs-item:last-child .fi-breadcrumbs-item-label {
    color: var(--ta-text) !important;
}

/* Sidebar */
.fi-sidebar {
    background: var(--ta-sidebar) !important;
    border-right: 0 !important;
}

.fi-sidebar .fi-sidebar-header {
    background: transparent !important;
    border-bottom: 1px solid var(--ta-sidebar-header-border, rgba(255, 255, 255, 0.06)) !important;
    min-height: 4.5rem;
}

.fi-sidebar .fi-logo {
    height: auto !important;
    min-height: 2rem;
    align-items: center;
    max-width: 100%;
}

.fi-sidebar .fi-logo,
.fi-sidebar .pc-brand-name {
    color: var(--ta-sidebar-brand, #fff) !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
}

.fi-sidebar .pc-brand {
    display: inline-flex !important;
    align-items: center;
    gap: 0.75rem !important;
    max-width: 100%;
    min-width: 0;
}

.fi-sidebar .pc-brand-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.fi-sidebar-group-label {
    color: var(--ta-sidebar-meta, var(--ta-meta)) !important;
    font-size: 0.75rem !important;
    font-weight: 500 !important;
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

.fi-sidebar-item-button {
    border-radius: 0.25rem !important;
    margin: 0.1rem 0.85rem !important;
    padding: 0.6rem 0.85rem !important;
}

.fi-sidebar-item-label,
.fi-sidebar-item-icon {
    color: var(--ta-sidebar-text, #dee4ee) !important;
    font-weight: 500 !important;
}

.fi-sidebar-item-button:hover {
    background: var(--ta-sidebar-hover) !important;
}

.fi-sidebar-item-active > .fi-sidebar-item-button {
    background: var(--ta-primary) !important;
}

.fi-sidebar-item-active .fi-sidebar-item-label,
.fi-sidebar-item-active .fi-sidebar-item-icon,
.fi-sidebar-item-button:hover .fi-sidebar-item-label,
.fi-sidebar-item-button:hover .fi-sidebar-item-icon {
    color: #fff !important;
}

/* Mobile sidebar drawer */
@media (max-width: 1023px) {
    .fi-sidebar-close-overlay {
        z-index: 45 !important;
    }

    .fi-main-sidebar.fi-sidebar {
        z-index: 50 !important;
        width: min(20rem, 86vw) !important;
        max-width: 86vw;
        box-shadow: 0 10px 40px rgba(15, 23, 42, 0.35);
    }

    .fi-sidebar .fi-sidebar-header {
        min-height: 4rem;
        padding-inline: 1rem !important;
        gap: 0.5rem;
    }

    .fi-sidebar .pc-brand {
        gap: 0.55rem !important;
    }

    .fi-sidebar .pc-brand-name {
        font-size: 0.98rem !important;
    }

    /* Show collapse/close control inside sidebar on mobile */
    .fi-main-sidebar .fi-sidebar-header .fi-icon-btn.ms-auto {
        display: inline-flex !important;
        color: #fff !important;
    }

    .fi-topbar-open-sidebar-btn,
    .fi-topbar-close-sidebar-btn {
        flex-shrink: 0;
    }

    .fi-sidebar-nav {
        padding-left: 1rem !important;
        padding-right: 1rem !important;
    }

    .fi-sidebar-item-button {
        margin-inline: 0.25rem !important;
    }
}

/* Topbar */
.fi-topbar {
    background: #fff !important;
    border-bottom: 1px solid var(--ta-stroke) !important;
    box-shadow: none !important;
}

/* ===== TailAdmin card sections ===== */
.fi-section {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    overflow: visible;
}

.fi-section > .fi-section-content-ctn,
.fi-section-content {
    padding: 1.5rem !important;
}

.fi-section-header {
    background: #fff !important;
    border-bottom: 1px solid var(--ta-stroke) !important;
    padding: 1rem 1.5rem !important;
}

.fi-section-header-heading {
    color: var(--ta-title) !important;
    font-size: 1rem !important;
    font-weight: 600 !important;
}

.fi-section-header-description {
    color: var(--ta-text) !important;
    font-size: 0.875rem !important;
}

/* Tables */
.fi-ta-ctn {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    overflow: hidden;
}

.fi-ta-header-toolbar {
    gap: 0.75rem !important;
    flex-wrap: wrap;
    border-bottom: 1px solid var(--ta-stroke);
    background: #fff;
}

/* Hide column show/hide toggle on all tables */
.fi-ta-col-toggle {
    display: none !important;
}

/* Products page header filters (before New product) */
.pc-product-header-actions {
    gap: 0.65rem !important;
}

@media (max-width: 768px) {
    .fi-header {
        gap: 1rem !important;
    }

    .pc-product-header-actions {
        width: 100%;
        justify-content: stretch;
    }

    .pc-header-filter-select,
    .pc-header-filter-date {
        flex: 1 1 calc(50% - 0.4rem);
        min-width: 0;
        width: 100%;
    }

    .pc-header-date-range {
        flex: 1 1 100%;
        width: 100%;
    }

    .pc-header-date-range .pc-header-filter-date {
        flex: 1 1 auto;
    }

    .pc-product-header-actions .fi-ac {
        width: 100%;
    }

    .pc-product-header-actions .fi-ac .fi-btn,
    .pc-product-header-actions .fi-btn {
        width: 100%;
        justify-content: center;
    }
}

.pc-header-filter-select {
    appearance: none;
    -webkit-appearance: none;
    min-width: 9.5rem;
    height: 2.25rem;
    padding: 0 2rem 0 0.75rem;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    background-size: 1rem;
    color: var(--ta-title);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
}
.pc-header-filter-select:hover {
    border-color: #cbd5e1;
}
.pc-header-filter-select:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.12);
}

.pc-header-date-range {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}
.pc-header-date-sep {
    color: var(--ta-meta);
    font-size: 0.8125rem;
    font-weight: 600;
}
.pc-header-filter-date {
    height: 2.25rem;
    padding: 0 0.55rem;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    background: #fff;
    color: var(--ta-title);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    min-width: 8.75rem;
}
.pc-header-filter-date:hover {
    border-color: #cbd5e1;
}
.pc-header-filter-date:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.12);
}

.fi-ta-empty-state-icon-ctn {
    display: none !important;
}

.fi-ta-empty-state-heading,
.fi-ta-empty-state-description {
    color: var(--ta-meta) !important;
    font-weight: 500 !important;
}

/* Mobile card view for index tables — compact */
@media (max-width: 767px) {
    .fi-ta-ctn {
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    .fi-ta-header-toolbar {
        border: 1px solid var(--ta-stroke) !important;
        border-radius: 0.45rem;
        margin-bottom: 0.5rem;
        padding-top: 0.55rem !important;
        padding-bottom: 0.55rem !important;
        background: #fff !important;
        gap: 0.5rem !important;
    }

    .fi-ta-content {
        overflow: visible !important;
        border: 0 !important;
    }

    .fi-ta-table {
        display: block;
        width: 100%;
    }

    .fi-ta-table > thead {
        display: none;
    }

    .fi-ta-table > tbody {
        display: flex;
        flex-direction: column;
        gap: 0.5rem;
    }

    .fi-ta-table > tbody > .fi-ta-row {
        display: block;
        width: 100%;
        background: #fff;
        border: 1px solid var(--ta-stroke);
        border-radius: 0.45rem;
        box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
        overflow: hidden;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell {
        display: flex !important;
        align-items: center;
        justify-content: space-between;
        gap: 0.5rem;
        width: 100% !important;
        max-width: none !important;
        padding: 0.28rem 0.7rem !important;
        border-bottom: 1px solid #f1f5f9;
        vertical-align: middle;
        min-height: 0 !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell:last-child {
        border-bottom: 0;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell::before {
        content: attr(data-label);
        flex: 0 0 auto;
        width: 32%;
        max-width: 6.75rem;
        color: var(--ta-meta);
        font-size: 0.62rem;
        font-weight: 700;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        line-height: 1.2;
        padding-top: 0;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell > .fi-ta-col-wrp,
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell > div {
        flex: 1 1 auto;
        min-width: 0;
        text-align: right;
        justify-content: flex-end;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* Kill Filament's default tall cell padding */
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell .fi-ta-text,
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell .fi-ta-col-wrp,
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell [class*="fi-ta-"] {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell .fi-ta-text-item-label,
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell .text-sm,
    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-cell span {
        font-size: 0.8125rem !important;
        line-height: 1.25 !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-selection-cell {
        display: none !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell {
        flex-direction: row;
        align-items: center;
        gap: 0.4rem;
        padding-top: 0.4rem !important;
        padding-bottom: 0.4rem !important;
        background: #f8fafc;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell::before {
        content: attr(data-label);
        width: 32%;
        max-width: 6.75rem;
        padding-top: 0;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell > div {
        width: auto;
        flex: 1 1 auto;
        text-align: right;
        white-space: normal !important;
        padding: 0 !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell .fi-ac {
        display: inline-flex !important;
        flex-wrap: wrap;
        gap: 0.15rem 0.35rem;
        justify-content: flex-end !important;
        width: 100%;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell .fi-btn {
        margin: 0 !important;
        min-height: 1.75rem !important;
        padding: 0.15rem 0.35rem !important;
        font-size: 0.75rem !important;
    }

    .fi-ta-table > tbody > .fi-ta-row > .fi-ta-actions-cell .fi-btn-icon {
        width: 0.95rem !important;
        height: 0.95rem !important;
    }

    .fi-ta-table .fi-ta-image,
    .fi-ta-table img {
        margin-left: auto;
        max-height: 2rem !important;
        width: auto !important;
    }

    .fi-ta-pagination {
        padding-top: 0.35rem;
        font-size: 0.75rem;
    }

    .fi-page-header {
        margin-bottom: 0.65rem !important;
    }

    .fi-header-heading {
        font-size: 1.2rem !important;
    }
}

/* Per page — top left (DataTables "l") */
.pc-ta-per-page {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
}

.pc-ta-per-page-label {
    color: var(--ta-text);
    font-size: 0.8125rem;
    font-weight: 500;
    white-space: nowrap;
}

.pc-ta-per-page-select {
    appearance: none;
    -webkit-appearance: none;
    min-width: 4.5rem;
    height: 2.25rem;
    padding: 0 1.75rem 0 0.75rem;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.375rem;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.5rem center;
    background-size: 0.9rem;
    color: var(--ta-title);
    font-size: 0.8125rem;
    font-weight: 500;
    line-height: 1;
    cursor: pointer;
}

.pc-ta-per-page-select:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.12);
}

/* Search — top right (DataTables "f") */
.fi-ta-search-field {
    width: 15rem;
    max-width: 100%;
}

.fi-ta-search-field .fi-input-wrp {
    border-radius: 0.375rem !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-color: transparent !important;
    border: 1px solid var(--ta-stroke) !important;
    background: #fff !important;
    min-height: 2.25rem;
}

.fi-ta-search-field .fi-input-wrp:focus-within {
    border-color: var(--ta-primary) !important;
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.12) !important;
}

.fi-ta-search-field .fi-input,
.fi-ta-search-field input {
    min-height: 2.25rem !important;
    height: 2.25rem !important;
    border: 0 !important;
    box-shadow: none !important;
    font-size: 0.8125rem !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}

.fi-ta-search-field .fi-input-wrp-prefix {
    color: var(--ta-meta) !important;
}

/* Hide Filament's bottom per-page — moved to toolbar */
.fi-ta-pagination .fi-pagination-records-per-page-select,
.fi-ta-pagination .fi-pagination-records-per-page-select.fi-compact,
.fi-ta-pagination > div.col-start-2 {
    display: none !important;
}

/* Pagination footer — info left, pages right (DataTables "i" / "p") */
.fi-ta-pagination.fi-pagination,
nav.fi-ta-pagination {
    display: flex !important;
    grid-template-columns: none !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 0.75rem !important;
    flex-wrap: wrap;
    border-top: 1px solid var(--ta-stroke);
    background: #fff;
    min-height: 3.25rem;
}

.fi-ta-pagination .fi-pagination-overview {
    display: inline !important;
    order: 1;
    justify-self: start !important;
    color: var(--ta-text) !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
}

.fi-ta-pagination .fi-pagination-previous-btn,
.fi-ta-pagination .fi-pagination-next-btn {
    display: none !important;
}

.fi-ta-pagination .fi-pagination-items {
    display: flex !important;
    order: 2;
    margin-left: auto;
    justify-self: end !important;
    border-radius: 0.375rem !important;
    box-shadow: none !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    border: 1px solid var(--ta-stroke);
    overflow: hidden;
    background: #fff !important;
}

.fi-ta-pagination .fi-pagination-item {
    min-width: 2.25rem;
    height: 2.25rem;
    font-size: 0.8125rem;
}

.fi-wi-stats-overview-stat {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.fi-wi-chart {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
}

.fi-wi-chart .fi-wi-chart-heading {
    color: var(--ta-title) !important;
    font-weight: 600 !important;
}

.fi-wi-chart .fi-wi-chart-description {
    color: var(--ta-text) !important;
}

.fi-wi-stats-overview-stat-value {
    color: var(--ta-title) !important;
    font-weight: 700 !important;
}

.fi-wi-stats-overview-stat-label {
    color: var(--ta-text) !important;
}

/* Form labels & inputs — modern TailAdmin style */
.fi-fo-field-wrp {
    gap: 0.5rem !important;
}

.fi-fo-field-wrp-label label,
.fi-fo-field-wrp-label span {
    color: var(--ta-title) !important;
    font-weight: 500 !important;
    font-size: 0.875rem !important;
}

.fi-fo-field-wrp-hint,
.fi-fo-field-wrp-helper-text {
    color: var(--ta-meta) !important;
    font-size: 0.8125rem !important;
}

.fi-input-wrp {
    background: #fff !important;
    border: 1px solid #d0d5dd !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04) !important;
    --tw-ring-shadow: 0 0 #0000 !important;
    --tw-ring-offset-shadow: 0 0 #0000 !important;
    transition: border-color 0.15s ease, box-shadow 0.15s ease !important;
    min-height: 2.75rem;
    overflow: visible;
}

.fi-input-wrp:hover {
    border-color: #98a2b3 !important;
}

.fi-input-wrp:focus-within {
    border-color: var(--ta-primary) !important;
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.14) !important;
    --tw-ring-color: transparent !important;
}

.fi-input-wrp.fi-disabled,
.fi-input-wrp:has(:disabled) {
    background: #f8fafc !important;
    border-color: #e2e8f0 !important;
    opacity: 1 !important;
}

.fi-input-wrp.fi-invalid {
    border-color: var(--ta-danger) !important;
}

.fi-input-wrp.fi-invalid:focus-within {
    box-shadow: 0 0 0 3px rgba(211, 64, 83, 0.14) !important;
}

.fi-input,
.fi-select-input,
textarea.fi-input,
select.fi-select-input {
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--ta-title) !important;
    font-size: 0.875rem !important;
    font-weight: 400 !important;
    min-height: 2.75rem !important;
    padding-top: 0.625rem !important;
    padding-bottom: 0.625rem !important;
    line-height: 1.4 !important;
}

.fi-input::placeholder,
textarea.fi-input::placeholder {
    color: #98a2b3 !important;
    opacity: 1 !important;
}

textarea.fi-input {
    min-height: 6.5rem !important;
    padding-top: 0.75rem !important;
    padding-bottom: 0.75rem !important;
    resize: vertical;
}

.fi-input-wrp-label {
    color: var(--ta-text) !important;
    font-size: 0.8125rem !important;
    font-weight: 500 !important;
}

.fi-input-wrp-prefix,
.fi-input-wrp-suffix {
    color: var(--ta-meta) !important;
}

.fi-fo-checkbox,
.fi-fo-toggle {
    accent-color: var(--ta-primary);
}

.pc-product-image-picker {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}

.pc-product-image-picker__frame {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 10rem;
    overflow: hidden;
    border: 1px dashed #d0d5dd;
    border-radius: 0.5rem;
    background: #f8fafc;
}

.pc-product-image-picker__preview {
    display: block;
    width: 100%;
    max-height: 12rem;
    object-fit: contain;
    background: #fff;
}

.pc-product-image-picker__empty {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    padding: 1.5rem 1rem;
    color: #667085;
    text-align: center;
    font-size: 0.875rem;
}

.pc-product-image-picker__empty small {
    color: #98a2b3;
    font-size: 0.75rem;
}

.pc-product-image-picker__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
}

.pc-product-image-picker__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.4rem 0.75rem;
    border: 1px solid #d0d5dd;
    border-radius: 0.375rem;
    background: #fff;
    color: var(--ta-text);
    font-size: 0.8125rem;
    font-weight: 500;
    cursor: pointer;
}

.pc-product-image-picker__btn:hover {
    background: #f8fafc;
}

.pc-product-image-picker__btn--muted {
    color: #667085;
}

.pc-product-image-picker__error {
    margin: 0;
    color: #d34053;
    font-size: 0.8125rem;
}

/* Form action bar — TailAdmin sticky footer card */
.fi-form-actions {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04) !important;
    margin-top: 1rem !important;
    padding: 1rem 1.25rem !important;
    gap: 0.75rem !important;
}

.fi-btn {
    border-radius: 0.5rem !important;
    font-weight: 500 !important;
    min-height: 2.5rem;
    padding-inline: 1rem !important;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.05) !important;
}

.fi-btn-primary {
    background: var(--ta-primary) !important;
    border-color: var(--ta-primary) !important;
}

.fi-btn-primary:hover {
    background: var(--ta-primary-dark) !important;
    border-color: var(--ta-primary-dark) !important;
}

/* Compact page content — reduce empty void */
.fi-resource-create-record-page .fi-page,
.fi-resource-edit-record-page .fi-page {
    padding-bottom: 1.5rem !important;
}

/* Login */
.fi-simple-layout {
    background: var(--ta-body) !important;
}

.fi-simple-main {
    background: #fff !important;
    border: 1px solid var(--ta-stroke) !important;
    border-radius: 0.5rem !important;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06) !important;
}

.fi-simple-header .pc-brand-name {
    display: none !important;
}

.pc-brand-logo {
    display: block;
    height: 3rem;
    width: auto;
    max-width: 9rem;
    object-fit: contain;
}

.fi-simple-header .pc-brand-logo {
    height: 4.25rem;
    max-width: 12rem;
}

.fi-sidebar .pc-brand-logo {
    height: 1.85rem;
    max-width: 7.5rem;
}

/* Custom cards */
.pc-card {
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    padding: 1.25rem 1.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.pc-card .pc-label {
    font-size: 0.875rem;
    font-weight: 500;
    color: var(--ta-text);
}

.pc-card .pc-value {
    margin-top: 0.35rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--ta-title);
}

.pc-card-accent {
    background: var(--ta-primary);
    border-color: var(--ta-primary);
}

.pc-card-accent .pc-label,
.pc-card-accent .pc-value {
    color: #fff;
}

.pc-table { width: 100%; font-size: 0.875rem; }
.pc-table th {
    padding: 0.85rem 0;
    text-align: left;
    font-weight: 500;
    color: var(--ta-text);
    border-bottom: 1px solid var(--ta-stroke);
}
.pc-table td {
    padding: 0.85rem 0;
    color: var(--ta-title);
    border-bottom: 1px solid var(--ta-stroke);
}

.pc-badge {
    display: inline-flex;
    align-items: center;
    border-radius: 0.25rem;
    padding: 0.2rem 0.6rem;
    font-size: 0.75rem;
    font-weight: 500;
    text-transform: capitalize;
}
.pc-badge-paid { background: #daf8e5; color: #1a8245; }
.pc-badge-unpaid { background: #fff0d5; color: #bf7b00; }
.pc-badge-draft { background: #e2e8f0; color: #64748b; }

.pc-welcome {
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    padding: 1.5rem 1.75rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pc-welcome-kicker {
    color: var(--ta-primary);
    font-size: 0.8rem;
    font-weight: 600;
    margin-bottom: 0.35rem;
}
.pc-welcome h2 {
    margin: 0;
    color: var(--ta-title);
    font-size: 1.5rem;
    font-weight: 700;
}
.pc-welcome p {
    margin: 0.4rem 0 0;
    color: var(--ta-text);
    font-size: 0.95rem;
}

.pc-brand-mark {
    display: inline-flex;
    height: 2rem;
    width: 2rem;
    align-items: center;
    justify-content: center;
    border-radius: 0.375rem;
    background: var(--ta-primary);
    color: #fff;
}

/* Reports page — compact */
.pc-reports { display: flex; flex-direction: column; gap: 0.85rem; }
.pc-reports-toolbar {
    display: grid;
    grid-template-columns: 1.1fr 1.4fr;
    gap: 0.85rem;
}
@media (max-width: 1024px) {
    .pc-reports-toolbar { grid-template-columns: 1fr; }
}
.pc-reports-period,
.pc-reports-downloads,
.pc-panel {
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}
.pc-reports-period,
.pc-reports-downloads { padding: 0.9rem 1rem; }
.pc-reports-period-title {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ta-meta);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin-bottom: 0.55rem;
}
.pc-reports-period-form .fi-fo-component-ctn { gap: 0.65rem !important; }
.pc-reports-presets { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.65rem; }
.pc-chip {
    border: 1px solid var(--ta-stroke);
    background: #f8fafc;
    color: var(--ta-text);
    border-radius: 999px;
    padding: 0.25rem 0.7rem;
    font-size: 0.75rem;
    font-weight: 500;
    cursor: pointer;
}
.pc-chip:hover { border-color: var(--ta-primary); color: var(--ta-primary); background: #eef2ff; }
.pc-download-grid {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.5rem;
}
@media (max-width: 1100px) {
    .pc-download-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .pc-download-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pc-download-btn {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.45rem;
    padding: 0.55rem 0.65rem;
    text-decoration: none !important;
    background: #fff;
    transition: border-color .15s ease, background .15s ease;
}
.pc-download-btn:hover { border-color: var(--ta-primary); background: #f8faff; }
.pc-download-btn-accent { border-color: #c4a484; background: #fbf7f2; }
.pc-download-btn-accent:hover { background: #f5ebe0; border-color: #b08d68; }
.pc-download-label { font-size: 0.8rem; font-weight: 600; color: var(--ta-title); }
.pc-download-meta { font-size: 0.7rem; color: var(--ta-meta); font-weight: 500; }
.pc-kpi-grid {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 0.65rem;
}
@media (max-width: 1100px) {
    .pc-kpi-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
    .pc-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
.pc-kpi {
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.5rem;
    padding: 0.7rem 0.85rem;
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}
.pc-kpi-accent { background: var(--ta-primary); border-color: var(--ta-primary); }
.pc-kpi-accent .pc-kpi-label,
.pc-kpi-accent .pc-kpi-value { color: #fff !important; }
.pc-kpi-label { font-size: 0.7rem; color: var(--ta-meta); font-weight: 600; text-transform: uppercase; letter-spacing: 0.03em; }
.pc-kpi-value { margin-top: 0.2rem; font-size: 1.15rem; font-weight: 700; color: var(--ta-title); line-height: 1.2; }
.pc-kpi-success { color: var(--ta-success) !important; }
.pc-kpi-danger { color: var(--ta-danger) !important; }
.pc-reports-panels {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 0.85rem;
}
@media (max-width: 1024px) {
    .pc-reports-panels { grid-template-columns: 1fr; }
}
.pc-panel-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.9rem;
    border-bottom: 1px solid var(--ta-stroke);
}
.pc-panel-head h3 {
    margin: 0;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--ta-title);
}
.pc-panel-meta { font-size: 0.75rem; color: var(--ta-meta); }
.pc-panel-body { padding: 0.35rem 0.9rem 0.7rem; }
.pc-table-compact th,
.pc-table-compact td { padding: 0.55rem 0.15rem !important; font-size: 0.8125rem; }
.pc-table-compact .right { text-align: right; }
.pc-cell-main { font-weight: 600; color: var(--ta-title); }
.pc-cell-sub { font-size: 0.72rem; color: var(--ta-meta); margin-top: 0.1rem; }
.pc-empty { color: var(--ta-meta); font-size: 0.8125rem; margin: 0.5rem 0; }
.pc-reports-footnote {
    background: #fff;
    border: 1px dashed #d0d5dd;
    border-radius: 0.5rem;
    padding: 0.7rem 0.9rem;
    font-size: 0.78rem;
    color: var(--ta-text);
    line-height: 1.45;
}
.pc-reports-footnote strong { color: var(--ta-title); }

.pc-reports-period-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.65rem;
}
.pc-date-field {
    display: flex;
    flex-direction: column;
    gap: 0.3rem;
    margin: 0;
}
.pc-date-field span {
    font-size: 0.75rem;
    font-weight: 500;
    color: var(--ta-text);
}
.pc-date-input {
    height: 2.35rem;
    border: 1px solid #d0d5dd;
    border-radius: 0.45rem;
    padding: 0 0.7rem;
    font-size: 0.8125rem;
    color: var(--ta-title);
    background: #fff;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.pc-date-input:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.14);
}

/* Low stock header: "Low stock" text badge + notification bell */
.pc-stock-bell {
    position: relative;
    margin-right: 0.15rem;
    overflow: visible;
}
.pc-stock-bell-row {
    display: inline-flex;
    align-items: center;
    gap: 0.5rem;
}
.pc-stock-label-badge {
    display: inline-flex;
    align-items: center;
    padding: 0.28rem 0.65rem;
    border-radius: 999px;
    background: #d34053;
    color: #fff !important;
    font-size: 0.72rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.01em;
    text-decoration: none !important;
    white-space: nowrap;
}
.pc-stock-label-badge:hover {
    background: #b83345;
    color: #fff !important;
}
.pc-stock-bell-btn {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.5rem;
    border: 1px solid var(--ta-stroke);
    background: #fff;
    color: var(--ta-title);
    cursor: pointer;
    overflow: visible;
}
.pc-stock-bell-btn:hover { background: #f8fafc; border-color: #cbd5e1; }
.pc-stock-bell-badge {
    position: absolute;
    top: -0.35rem;
    right: -0.35rem;
    z-index: 5;
    min-width: 1.15rem;
    height: 1.15rem;
    padding: 0 0.28rem;
    border-radius: 999px;
    background: #d34053 !important;
    color: #fff !important;
    border: 2px solid #fff;
    font-size: 0.65rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    box-shadow: 0 1px 3px rgba(211, 64, 83, 0.45);
}
.pc-stock-bell-panel {
    position: absolute;
    right: 0;
    top: calc(100% + 0.45rem);
    width: 22rem;
    max-width: min(22rem, calc(100vw - 1.5rem));
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.6rem;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.12);
    z-index: 60;
    overflow: hidden;
}
.pc-stock-bell-head,
.pc-stock-bell-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 0.9rem;
    border-bottom: 1px solid var(--ta-stroke);
}
.pc-stock-bell-foot { border-bottom: 0; border-top: 1px solid var(--ta-stroke); }
.pc-stock-bell-title { font-size: 0.875rem; font-weight: 700; color: var(--ta-title); }
.pc-stock-bell-sub { font-size: 0.72rem; color: var(--ta-meta); margin-top: 0.1rem; }
.pc-stock-bell-link,
.pc-stock-bell-foot a {
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--ta-primary);
    text-decoration: none !important;
}
.pc-stock-bell-list { max-height: 18rem; overflow: auto; }
.pc-stock-bell-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.7rem 0.9rem;
    border-bottom: 1px solid #f1f5f9;
    text-decoration: none !important;
}
.pc-stock-bell-item:hover { background: #f8fafc; }
.pc-stock-bell-item-name { font-size: 0.8125rem; font-weight: 600; color: var(--ta-title); }
.pc-stock-bell-item-meta { font-size: 0.7rem; color: var(--ta-meta); margin-top: 0.1rem; }
.pc-stock-bell-item-tag {
    font-size: 0.65rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--ta-danger);
    background: #fde8eb;
    border-radius: 999px;
    padding: 0.15rem 0.45rem;
}
.pc-stock-bell-empty {
    padding: 1.1rem 0.9rem;
    font-size: 0.8125rem;
    color: var(--ta-meta);
}

.pc-stock-bell-section-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.5rem;
    padding: 0.55rem 0.9rem 0.35rem;
    font-size: 0.7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--ta-meta);
    background: #f8fafc;
    border-bottom: 1px solid #f1f5f9;
}

.pc-stock-bell-section-note {
    padding: 0.45rem 0.9rem 0.65rem;
    font-size: 0.75rem;
    color: var(--ta-meta);
    border-bottom: 1px solid #f1f5f9;
}

.pc-stock-bell-item-tag-warning {
    color: #b45309;
    background: #fef3c7;
}

.pc-stock-bell-foot {
    gap: 1rem;
}

/* Dashboard Bootstrap-style dismissible alerts */
.pc-bs-alerts {
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pc-bs-alert {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.85rem 1rem;
    border: 1px solid transparent;
    border-radius: 0.375rem;
    font-size: 0.9375rem;
    line-height: 1.45;
}
.pc-bs-alert-content {
    flex: 1;
    min-width: 0;
}
.pc-bs-alert-content a {
    font-weight: 600;
    text-decoration: underline;
}
.pc-bs-alert-content a:hover {
    text-decoration: none;
}
.pc-bs-alert-primary {
    color: #084298;
    background-color: #cfe2ff;
    border-color: #b6d4fe;
}
.pc-bs-alert-primary a { color: #084298; }
.pc-bs-alert-secondary {
    color: #41464b;
    background-color: #e2e3e5;
    border-color: #d3d6d8;
}
.pc-bs-alert-secondary a { color: #41464b; }
.pc-bs-alert-success {
    color: #0f5132;
    background-color: #d1e7dd;
    border-color: #badbcc;
}
.pc-bs-alert-success a { color: #0f5132; }
.pc-bs-alert-danger {
    color: #842029;
    background-color: #f8d7da;
    border-color: #f5c2c7;
}
.pc-bs-alert-danger a { color: #842029; }
.pc-bs-alert-warning {
    color: #664d03;
    background-color: #fff3cd;
    border-color: #ffecb5;
}
.pc-bs-alert-warning a { color: #664d03; }
.pc-bs-alert-info {
    color: #055160;
    background-color: #cff4fc;
    border-color: #b6effb;
}
.pc-bs-alert-info a { color: #055160; }
.pc-bs-alert-close {
    flex-shrink: 0;
    width: 1.5rem;
    height: 1.5rem;
    border: 0;
    background: transparent;
    color: inherit;
    opacity: 0.55;
    cursor: pointer;
    font-size: 1.35rem;
    line-height: 1;
    padding: 0;
    border-radius: 0.25rem;
}
.pc-bs-alert-close:hover {
    opacity: 1;
    background: rgba(0, 0, 0, 0.06);
}

/* Header theme switcher (light / dark / system) */
.pc-header-theme-switcher {
    margin-right: 0.15rem;
}
.pc-header-theme-switcher .fi-theme-switcher {
    padding: 0.2rem;
    border-radius: 0.5rem;
    border: 1px solid var(--ta-stroke);
    background: #fff;
}
html.dark .pc-header-theme-switcher .fi-theme-switcher {
    background: rgb(30 41 59);
    border-color: #475569;
}

/* Settings page — separated tab panels */
.pc-settings-form .fi-fo-tabs-tab {
    margin-top: 0.75rem;
}
.pc-settings-form .fi-fo-tabs-tab .fi-section {
    margin-bottom: 0;
}
.pc-settings-actions {
    margin-top: 0.5rem;
}

/* Dark mode — custom admin chrome */
html.dark .fi-topbar {
    background: rgba(15, 23, 42, 0.95) !important;
    border-bottom-color: #334155 !important;
}
html.dark .fi-ta-ctn,
html.dark .fi-section {
    background: #1e293b !important;
    border-color: #334155 !important;
}
html.dark .fi-section-header {
    background: #1e293b !important;
    border-color: #334155 !important;
}
html.dark .fi-section-header-heading {
    color: #f1f5f9 !important;
}
html.dark .fi-ta-header-toolbar {
    background: #1e293b !important;
    border-color: #334155 !important;
}
html.dark .pc-stock-bell-btn {
    background: #1e293b;
    border-color: #475569;
    color: #f1f5f9;
}
html.dark .pc-stock-bell-panel {
    background: #1e293b;
    border-color: #334155;
}
html.dark .pc-stock-bell-item:hover {
    background: #334155;
}
html.dark .pc-stock-bell-section-head {
    background: #0f172a;
    border-color: #334155;
}
html.dark .pc-bs-alert-danger {
    color: #f8d7da;
    background-color: #58151c;
    border-color: #842029;
}

/* Point of Sale */
.pc-pos { display: flex; flex-direction: column; gap: 0.85rem; }
.pc-pos-layout {
    display: grid;
    grid-template-columns: minmax(0, 1.9fr) minmax(19rem, 0.8fr);
    gap: 0.85rem;
    align-items: start;
}
@media (max-width: 1100px) {
    .pc-pos-layout { grid-template-columns: 1fr; }
}
.pc-pos-catalog,
.pc-pos-cart {
    background: #fff;
    border: 1px solid var(--ta-stroke);
    border-radius: 0.6rem;
    box-shadow: 0 1px 2px rgba(16, 24, 40, 0.04);
}
.pc-pos-toolbar {
    padding: 0.9rem 1rem;
    border-bottom: 1px solid var(--ta-stroke);
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.pc-pos-search {
    width: 100%;
    height: 2.5rem;
    border: 1px solid #d0d5dd;
    border-radius: 0.45rem;
    padding: 0 0.85rem;
    font-size: 0.875rem;
    color: var(--ta-title);
    background: #fff;
}
.pc-pos-search:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.14);
}
.pc-pos-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
}
.pc-chip-active {
    background: var(--ta-primary) !important;
    border-color: var(--ta-primary) !important;
    color: #fff !important;
}
.pc-pos-products {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(10.5rem, 1fr));
    gap: 0.65rem;
    padding: 0.85rem;
    max-height: calc(100vh - 11rem);
    overflow: auto;
}
.pc-pos-products.pc-pos-loading { opacity: 0.65; }
.pc-pos-product {
    position: relative;
    display: flex;
    flex-direction: column;
    text-align: left;
    border: 1px solid #e4e7ec;
    border-radius: 0.55rem;
    background: #fff;
    padding: 0;
    cursor: pointer;
    transition: border-color 0.15s, box-shadow 0.15s, transform 0.15s;
    overflow: hidden;
}
.pc-pos-product:hover:not(:disabled) {
    border-color: var(--ta-primary);
    box-shadow: 0 4px 14px rgba(60, 80, 224, 0.12);
    transform: translateY(-1px);
}
.pc-pos-product-in-cart { border-color: var(--ta-primary); box-shadow: 0 0 0 1px var(--ta-primary); }
.pc-pos-product-out { opacity: 0.55; cursor: not-allowed; }
.pc-pos-product-media {
    aspect-ratio: 1.15;
    background: #f8fafc;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}
.pc-pos-product-media img { width: 100%; height: 100%; object-fit: cover; }
.pc-pos-product-placeholder {
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 999px;
    background: #e2e8f0;
    color: #64748b;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
}
.pc-pos-product-body { padding: 0.65rem 0.7rem 0.75rem; }
.pc-pos-product-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ta-title);
    line-height: 1.3;
    min-height: 2.1rem;
}
.pc-pos-product-meta {
    display: flex;
    justify-content: space-between;
    gap: 0.35rem;
    margin-top: 0.25rem;
    font-size: 0.68rem;
    color: var(--ta-meta);
}
.pc-pos-product-price {
    margin-top: 0.45rem;
    font-size: 0.9rem;
    font-weight: 700;
    color: var(--ta-primary);
}
.pc-pos-product-badge {
    position: absolute;
    top: 0.45rem;
    right: 0.45rem;
    min-width: 1.35rem;
    height: 1.35rem;
    padding: 0 0.35rem;
    border-radius: 999px;
    background: var(--ta-primary);
    color: #fff;
    font-size: 0.72rem;
    font-weight: 700;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.pc-pos-empty,
.pc-pos-cart-empty {
    grid-column: 1 / -1;
    padding: 2rem 1rem;
    text-align: center;
    color: var(--ta-meta);
    font-size: 0.875rem;
}
.pc-pos-cart {
    position: sticky;
    top: 5.5rem;
    display: flex;
    flex-direction: column;
    max-height: calc(100vh - 6.5rem);
}
.pc-pos-cart-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid var(--ta-stroke);
}
.pc-pos-cart-head-left {
    flex: 0 0 auto;
    min-width: 0;
}
.pc-pos-cart-head-customer {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 14rem;
    display: flex;
    flex-direction: column;
    gap: 0.25rem;
    margin-left: auto;
}
.pc-pos-cart-head-customer label {
    font-size: 0.68rem;
    font-weight: 600;
    color: var(--ta-meta);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.pc-pos-customer-row {
    display: flex;
    align-items: center;
    gap: 0.35rem;
    min-width: 0;
}
.pc-pos-customer-row .pc-pos-select {
    flex: 1;
    min-width: 0;
}
.pc-pos-customer-add {
    flex: 0 0 auto;
}
.pc-pos-customer-add .fi-ac-btn-action {
    width: 2.35rem;
    height: 2.35rem;
    border-radius: 0.45rem;
    border: 1px solid #d0d5dd;
    background: #fff;
    color: var(--ta-primary);
}
.pc-pos-customer-add .fi-ac-btn-action:hover {
    border-color: var(--ta-primary);
    background: #f8fafc;
}
@media (max-width: 520px) {
    .pc-pos-cart-head {
        flex-direction: column;
        align-items: stretch;
    }
    .pc-pos-cart-head-customer {
        max-width: none;
        margin-left: 0;
    }
    .pc-pos-summary-row {
        grid-template-columns: 1fr;
    }
}
.pc-pos-cart-title { font-size: 0.95rem; font-weight: 700; color: var(--ta-title); }
.pc-pos-cart-sub { font-size: 0.75rem; color: var(--ta-meta); margin-top: 0.1rem; }
.pc-pos-link-btn {
    border: 0;
    background: transparent;
    color: var(--ta-primary);
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    padding: 0;
}
.pc-pos-field {
    padding: 0.75rem 1rem 0;
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
}
.pc-pos-field label {
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--ta-meta);
    text-transform: uppercase;
    letter-spacing: 0.03em;
}
.pc-pos-field-compact {
    padding: 0;
    min-width: 0;
}
.pc-pos-summary-row {
    display: grid;
    grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr);
    gap: 0.5rem;
    align-items: end;
}
.pc-pos-textarea,
.pc-pos-discount-input,
.pc-pos-rate-input,
.pc-pos-qty-input {
    border: 1px solid #d0d5dd;
    border-radius: 0.45rem;
    font-size: 0.8125rem;
    color: var(--ta-title);
    background-color: #fff;
}
.pc-pos-select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    height: 2.35rem;
    padding: 0 2rem 0 0.7rem;
    border: 1px solid #d0d5dd;
    border-radius: 0.45rem;
    background-color: #fff;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%2364748b'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M19 9l-7 7-7-7'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 0.55rem center;
    background-size: 1rem;
    font-size: 0.8125rem;
    color: var(--ta-title);
    line-height: 1.2;
    cursor: pointer;
}
.pc-pos-select:hover {
    border-color: #cbd5e1;
}
.pc-pos-select:focus {
    outline: none;
    border-color: var(--ta-primary);
    box-shadow: 0 0 0 3px rgba(60, 80, 224, 0.14);
}
.pc-pos-discount-input {
    height: 2.35rem;
    padding: 0 0.5rem;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
}
.pc-pos-textarea {
    padding: 0.55rem 0.7rem;
    resize: vertical;
    min-height: 3.25rem;
}
.pc-pos-cart-items {
    flex: 1;
    overflow: auto;
    padding: 0.75rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.pc-pos-cart-item {
    border: 1px solid #e4e7ec;
    border-radius: 0.5rem;
    padding: 0.65rem 0.7rem;
    background: #fafbfc;
}
.pc-pos-cart-item-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 0.5rem;
}
.pc-pos-cart-item-info {
    min-width: 0;
    flex: 1;
}
.pc-pos-cart-item-name {
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ta-title);
    line-height: 1.35;
}
.pc-pos-cart-item-meta {
    font-size: 0.68rem;
    font-weight: 500;
    color: var(--ta-meta);
}
.pc-pos-icon-btn {
    border: 0;
    background: transparent;
    color: #94a3b8;
    font-size: 1.2rem;
    line-height: 1;
    cursor: pointer;
    padding: 0;
}
.pc-pos-icon-btn:hover { color: var(--ta-danger); }
.pc-pos-cart-item-controls {
    display: grid;
    grid-template-columns: auto 1fr auto;
    gap: 0.45rem;
    align-items: center;
    margin-top: 0.55rem;
}
.pc-pos-qty {
    display: inline-flex;
    align-items: center;
    border: 1px solid #d0d5dd;
    border-radius: 0.45rem;
    overflow: hidden;
    background: #fff;
}
.pc-pos-qty-btn {
    width: 1.75rem;
    height: 2rem;
    border: 0;
    background: #f8fafc;
    color: var(--ta-title);
    cursor: pointer;
    font-size: 0.95rem;
}
.pc-pos-qty-input {
    width: 3rem;
    height: 2rem;
    border: 0;
    text-align: center;
    padding: 0;
}
.pc-pos-rate {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.78rem;
    color: var(--ta-meta);
}
.pc-pos-rate-input {
    width: 100%;
    height: 2rem;
    padding: 0 0.45rem;
}
.pc-pos-line-total {
    font-size: 0.8125rem;
    font-weight: 700;
    color: var(--ta-title);
    text-align: right;
    white-space: nowrap;
}
.pc-pos-summary {
    border-top: 1px solid var(--ta-stroke);
    padding: 0.85rem 1rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 0.65rem;
}
.pc-pos-discount {
    display: grid;
    grid-template-columns: 3.75rem minmax(0, 1fr);
    gap: 0.35rem;
    min-width: 0;
}
.pc-pos-discount .pc-pos-select {
    padding-right: 1.5rem;
    background-position: right 0.35rem center;
}
.pc-pos-gst-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    font-size: 0.8125rem;
    font-weight: 600;
    color: var(--ta-title);
    cursor: pointer;
    user-select: none;
}
.pc-pos-gst-toggle input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--ta-primary);
    cursor: pointer;
}
.pc-pos-totals {
    display: flex;
    flex-direction: column;
    gap: 0.35rem;
    padding-top: 0.15rem;
}
.pc-pos-total-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 0.75rem;
    font-size: 0.78rem;
    color: var(--ta-text);
}
.pc-pos-total-discount { color: var(--ta-success); }
.pc-pos-total-grand {
    margin-top: 0.25rem;
    padding-top: 0.55rem;
    border-top: 1px dashed #d0d5dd;
    font-size: 0.95rem;
    font-weight: 700;
    color: var(--ta-title);
}
.pc-pos-checkout-btn {
    width: 100%;
    height: 2.75rem;
    border: 0;
    border-radius: 0.5rem;
    background: var(--ta-primary);
    color: #fff;
    font-size: 0.9rem;
    font-weight: 700;
    cursor: pointer;
    margin-top: 0.15rem;
}
.pc-pos-checkout-btn:hover:not(:disabled) { filter: brightness(0.95); }
.pc-pos-checkout-btn:disabled { opacity: 0.55; cursor: not-allowed; }