/* Layout fixes only — preserves the original visual theme. */
html {
    width: 100%;
    min-height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-text-size-adjust: 100%;
}

body {
    width: 100%;
    min-height: 100vh;
    min-height: 100dvh;
    overflow-x: hidden;
    overflow-y: auto !important;
    overscroll-behavior-y: auto;
    -webkit-overflow-scrolling: touch;
}

img, svg, video, canvas { max-width: 100%; }
button, a, input, select, textarea { touch-action: manipulation; }
input, select, textarea, button { max-width: 100%; font-family: inherit; }
p, small, span, strong, td, th, label { overflow-wrap: break-word; }
.main-content, .sales-layout, .main-area, .sales-sidebar,
.stats-grid, .quick-actions-grid, .week-stats, .prices-grid,
.summary-cards, .stats-row, .two-column-layout, .expense-layout,
.card, .card-body { min-width: 0; }

.main-content {
    width: auto;
    max-width: none !important;
    margin: 0;
    overflow: visible;
}

.table-container {
    width: 100%;
    max-width: 100%;
    overflow-x: auto !important;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
}

.filter-buttons {
    flex-wrap: nowrap;
    max-width: 100%;
    overflow-x: auto;
    padding-bottom: 4px;
    -webkit-overflow-scrolling: touch;
}
.filter-buttons .btn { flex: 0 0 auto; }

/* Desktop alignment */
@media (min-width: 992px) {
    body.has-sidebar { padding-left: var(--sidebar-width); }
    .desktop-sidebar { width: var(--sidebar-width); }
    .main-content { padding: 32px 40px 48px; }
    .stats-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
    .stats-grid .stat-card-wide { grid-column: auto; }
    .quick-actions-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .week-stats { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .prices-grid, .prices-summary { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .stats-row { grid-template-columns: repeat(6, minmax(0, 1fr)); }
    .stats-row .stat-box-wide { grid-column: auto; }
    .counters-grid {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 4px;
    }
    .counters-grid .counter-card:first-child { grid-column: auto; }
}

@media (min-width: 1200px) {
    .sales-layout {
        display: grid;
        grid-template-columns: minmax(0, 1fr) 340px;
        gap: 32px;
        align-items: start;
    }
}

@media (min-width: 1500px) {
    .stats-grid { grid-template-columns: repeat(7, minmax(0, 1fr)); }
}

/* iPhone / mobile stability */
@media (max-width: 991.98px) {
    body.has-sidebar {
        padding-top: calc(60px + env(safe-area-inset-top));
        padding-bottom: 0;
    }

    .mobile-header {
        height: calc(60px + env(safe-area-inset-top));
        padding-top: env(safe-area-inset-top);
        padding-left: max(12px, env(safe-area-inset-left));
        padding-right: max(12px, env(safe-area-inset-right));
        background: rgba(17, 17, 17, .94);
        -webkit-backdrop-filter: blur(14px);
        backdrop-filter: blur(14px);
    }
    .mobile-header .back-btn { left: max(12px, env(safe-area-inset-left)); }
    .mobile-header .logout { right: max(12px, env(safe-area-inset-right)); }

    .bottom-nav {
        min-height: calc(var(--bottom-nav-height) + env(safe-area-inset-bottom));
        padding-left: env(safe-area-inset-left);
        padding-right: env(safe-area-inset-right);
        padding-bottom: calc(8px + env(safe-area-inset-bottom));
        background: rgba(17, 17, 17, .96);
        -webkit-backdrop-filter: blur(16px);
        backdrop-filter: blur(16px);
    }
    .bottom-nav .nav-item { min-width: 0; }
    .bottom-nav .nav-item span {
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center;
    }

    .main-content {
        min-height: auto;
        padding: 16px max(12px, env(safe-area-inset-right)) calc(28px + var(--bottom-nav-height) + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    }

    .form-control, .form-select, .form-control-lg { font-size: 16px; }
    .btn, .action-btn, .counter-btn, .date-nav { min-height: 44px; }
    textarea.form-control { min-height: 96px; padding-top: 12px; }
    .card-header { min-height: 52px; padding: 15px 16px; font-size: 14px; }
    .card-body { padding: 16px; }
    .alert { align-items: flex-start; padding: 12px 14px; line-height: 1.5; }
    .modal-overlay { align-items: flex-end; padding: 12px max(12px, env(safe-area-inset-right)) calc(12px + env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
    .modal-box { max-height: calc(100dvh - 90px); overflow-y: auto; }

    .summary-cards {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        max-width: 100%;
    }
    .summary-card { min-width: 0; }
    .summary-card strong { overflow-wrap: anywhere; }

    .quick-actions-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .week-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .prices-grid, .prices-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sale-card { gap: 10px; }
    .sale-info { min-width: 0; }
    .sale-right { flex: 0 0 auto; }

    .page-loader { height: 100dvh; }
    .toast-notification { top: calc(76px + env(safe-area-inset-top)); }

    .payment-entry-form,
    .expense-filters {
        flex-direction: column;
        align-items: stretch !important;
    }
    .payment-entry-form > *, .expense-filters > * { width: 100% !important; }

    .prices-layout { gap: 12px; }
    .pricing-help { display: block; margin-top: 8px; line-height: 1.65; white-space: normal; }
    .statistics-summary-grid { gap: 8px; }
    .statistics-summary-grid .stat-card { min-height: 108px; }
    .statistics-summary-grid .card-body { padding: 14px 12px; }
    .statistics-summary-grid .stat-value { font-size: clamp(17px, 5vw, 22px); }
    .statistics-summary-grid .stat-label { line-height: 1.35; }
    .chart-shell { position: relative; width: 100%; height: 240px; }
    .averages-grid, .records-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; text-align: center; }
    .averages-grid > *, .records-grid > * { width: auto; padding: 14px 8px; background: var(--bg-secondary); border: 1px solid var(--border-color); }
    .averages-grid > :last-child, .records-grid > :last-child { grid-column: 1 / -1; }

    .sale-card { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; }
    .sale-info h4 { line-height: 1.4; }
    .sale-info .meta { gap: 6px 10px; line-height: 1.5; }
    .sale-right { min-width: 0; gap: 8px; }
    .sale-actions { flex-shrink: 0; }

    .expense-modal, .payment-modal { height: 100dvh; }
    .expense-modal-panel { padding-bottom: env(safe-area-inset-bottom); }
    .payment-modal { align-items: flex-end; padding: 10px 10px calc(10px + env(safe-area-inset-bottom)); }
    .payment-modal-box { max-height: calc(100dvh - 20px - env(safe-area-inset-bottom)); overflow-y: auto; }
    .payment-modal-head { position: sticky; top: 0; z-index: 2; background: rgba(20,20,20,.97); }
    .payment-modal-footer { position: sticky; bottom: 0; z-index: 2; padding-bottom: calc(13px + env(safe-area-inset-bottom)); }
}

@media (max-width: 390px) {
    .main-content { padding-left: 10px; padding-right: 10px; }
    .summary-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .summary-cards > :last-child:nth-child(odd) { grid-column: 1 / -1; }
    .quick-actions-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .sale-card { grid-template-columns: 1fr; align-items: stretch; padding: 14px; }
    .sale-right { justify-content: space-between; text-align: left; }
    .sale-actions { margin-left: auto; }
    .statistics-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .statistics-summary-grid .stat-card:last-child { grid-column: 1 / -1; }
    .week-summary-header { align-items: flex-start; flex-direction: column; gap: 5px; }
    .pending-card-footer { align-items: flex-start; flex-direction: column; gap: 7px; }
}

@media (max-width: 340px) {
    .main-content { padding-left: 8px; padding-right: 8px; }
    .bottom-nav .nav-item span { font-size: 9px; }
    .bottom-nav .nav-item i { font-size: 20px; }
    .mobile-header .logo { max-width: 185px; height: auto; max-height: 34px; }
    .expense-kpis { grid-template-columns: 1fr !important; }
    .type-options { grid-template-columns: 1fr !important; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
}