/**
 * ISOMER OIL Davomat — mobil va planshet adaptivligi
 */

/* ——— Asosiy (notch, zoom) ——— */
@supports (padding: env(safe-area-inset-bottom)) {
  .premium-ui {
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
  }

  .site-footer.footer-premium {
    padding-bottom: calc(0.75rem + env(safe-area-inset-bottom));
  }
}

.premium-ui {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* iOS input focus zoom oldini olish */
@media (max-width: 767.98px) {
  .premium-ui input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  .premium-ui select,
  .premium-ui textarea {
    font-size: 16px !important;
  }
}

/* ——— Navbar ——— */
@media (max-width: 991.98px) {
  .navbar-premium .navbar-brand {
    font-size: 1rem;
    max-width: calc(100vw - 4.5rem);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .navbar-premium .navbar-brand .fs-6 {
    display: none;
  }

  .navbar-premium .nav-link {
    padding: 0.65rem 0.85rem !important;
    min-height: 44px;
    display: flex;
    align-items: center;
    border-radius: 10px;
  }

  .navbar-premium .navbar-toggler {
    min-width: 44px;
    min-height: 44px;
    padding: 0.5rem;
  }
}

/* ——— Sahifa konteyneri ——— */
@media (max-width: 767.98px) {
  main.app-page,
  .salary-skip-app-shell {
    padding-left: max(0.65rem, env(safe-area-inset-left)) !important;
    padding-right: max(0.65rem, env(safe-area-inset-right)) !important;
    padding-top: 0.85rem !important;
    padding-bottom: 1.25rem !important;
  }

  .app-page {
    padding-bottom: 1rem;
  }

  .page-hero,
  .page-hero--premium {
    padding: 1.15rem 1.2rem !important;
    border-radius: 14px;
  }

  .page-hero-title {
    font-size: 1.25rem !important;
    line-height: 1.3;
  }

  .page-hero-sub {
    font-size: 0.85rem;
  }

  .page-hero .text-md-end {
    text-align: left !important;
    margin-top: 0.5rem;
  }

  /* Toolbar — tugmalar to'liq kenglik */
  .app-toolbar {
    flex-direction: column;
    align-items: stretch !important;
    gap: 0.5rem;
  }

  .app-toolbar .btn,
  .app-toolbar .btn-group {
    width: 100%;
  }

  .app-toolbar .btn-group {
    display: flex;
  }

  .app-toolbar .btn-group .btn {
    flex: 1;
  }

  .app-search-form {
    width: 100%;
    flex-direction: column !important;
  }

  .app-search-form .form-control,
  .app-search-form .btn {
    width: 100%;
    min-width: 0 !important;
  }

  .app-filter-card {
    padding: 1rem;
    border-radius: 14px;
  }

  .app-filter-card .row > [class*="col-"] {
    margin-bottom: 0.15rem;
  }

  .app-filter-card .btn {
    min-height: 44px;
  }

  .app-panel-body {
    padding: 1rem;
  }

  .app-stat-number {
    font-size: 1.85rem;
  }

  .app-form-panel {
    max-width: 100%;
  }

  .app-form-panel .app-panel-body {
    padding: 1.1rem;
  }

  /* Jadval → mobil karta rejimi */
  .app-table-responsive-hide-sm {
    display: none !important;
  }

  .app-mobile-cards {
    display: block !important;
  }

  /* Jadval qolgan sahifalarda — gorizontal scroll */
  main .table-responsive:not(.salary-table-responsive),
  .app-page .app-panel:not(.app-table-responsive-hide-sm) .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    margin: 0 -0.25rem;
    padding: 0 0.25rem 0.5rem;
  }

  .app-page .table-responsive.is-scrollable {
    position: relative;
    box-shadow: inset -12px 0 12px -8px rgba(15, 23, 42, 0.08);
  }

  .app-table-scroll-hint {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.35rem;
    font-size: 0.72rem;
    font-weight: 600;
    color: #64748b;
    padding: 0.35rem 0.5rem 0.5rem;
    text-align: center;
  }

  .app-table-scroll-hint i {
    color: #6366f1;
  }

  .app-table {
    min-width: 640px;
  }

  .app-table .btn-group-sm .btn {
    min-width: 40px;
    min-height: 40px;
    padding: 0.4rem 0.5rem;
  }

  /* Mobil kartalar */
  .app-mobile-card {
    padding: 1rem 1.1rem;
    border-radius: 14px;
    margin-bottom: 0.65rem;
    border: 1px solid #e2e8f0;
    box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
  }

  .app-mobile-card-title {
    font-size: 1.02rem;
    line-height: 1.3;
    word-break: break-word;
  }

  .app-mobile-card__meta {
    font-size: 0.82rem;
    color: #64748b;
    margin-bottom: 0.65rem;
    line-height: 1.45;
  }

  .app-mobile-card__meta span {
    display: block;
  }

  .app-mobile-card__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
  }

  .app-mobile-card__actions .btn {
    flex: 1 1 calc(50% - 0.25rem);
    min-height: 42px;
    font-size: 0.82rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.25rem;
  }

  .app-mobile-card__actions .btn-icon-only {
    flex: 0 0 44px;
    padding: 0;
  }

  /* Dashboard */
  .app-page .row.g-4 > [class*="col-"] {
    margin-bottom: 0;
  }

  .app-quick-links .col-md-6 {
    margin-bottom: 0.5rem;
  }

  /* Statistika sahifasi */
  .stats-page .stats-filter-card {
    padding: 1rem;
  }

  .stats-page .stats-filter-card .d-flex.flex-wrap.gap-2 {
    flex-direction: column;
  }

  .stats-page .stats-filter-card .d-flex.flex-wrap.gap-2 .btn {
    width: 100%;
    min-height: 44px;
  }

  .stats-page .stats-summary-card {
    padding: 0.85rem;
  }

  .stats-page .stats-summary-value {
    font-size: 1.35rem;
  }

  .stats-page .stats-chart-card {
    padding: 0.85rem;
  }

  /* Oylik statistika */
  .salary-skip-app-shell .salary-hero {
    padding: 1.15rem 1rem;
  }

  .salary-filters__body .row > [class*="col-"] {
    width: 100%;
  }

  .salary-filters__actions .btn {
    flex: 1 1 100%;
    min-width: 100% !important;
    min-height: 44px;
  }

  .salary-kpi-grid {
    grid-template-columns: 1fr 1fr;
    gap: 0.55rem;
  }

  .salary-kpi {
    padding: 0.75rem;
    gap: 0.6rem;
  }

  .salary-kpi__icon {
    width: 38px;
    height: 38px;
    font-size: 1rem;
  }

  .salary-kpi__value {
    font-size: 1.15rem;
  }

  .salary-modal.modal .modal-dialog {
    margin: 0.5rem auto;
    max-width: calc(100% - 1rem);
  }

  .salary-modal__header.modal-header {
    padding: 1.1rem 1rem 1rem;
  }

  .salary-modal__name {
    font-size: 1.1rem !important;
  }

  /* Toast / xabarlar */
  .position-fixed.top-0.end-0.p-3 {
    top: auto !important;
    bottom: calc(0.75rem + env(safe-area-inset-bottom, 0px)) !important;
    left: 0.75rem !important;
    right: 0.75rem !important;
    padding: 0 !important;
  }

  .position-fixed.top-0.end-0 .toast {
    max-width: 100%;
    width: 100%;
  }

  .site-footer.footer-premium p {
    font-size: 0.78rem;
    line-height: 1.5;
  }

  .site-footer.footer-premium .mx-2 {
    display: none;
  }

  .app-login-wrap {
    min-height: calc(100dvh - 120px);
    padding: 1rem;
  }

  .app-login-card {
    padding: 1.5rem 1.25rem;
  }

  .app-confirm-panel {
    margin: 1rem auto;
    padding: 0 0.5rem;
  }
}

/* Planshet: jadval scroll, karta emas */
@media (min-width: 768px) and (max-width: 991.98px) {
  .app-table-responsive-hide-sm {
    display: block !important;
  }

  .app-mobile-cards {
    display: none !important;
  }

  .app-page .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .app-table {
    min-width: 720px;
  }
}

/* Kichik telefonlar */
@media (max-width: 380px) {
  .salary-kpi-grid {
    grid-template-columns: 1fr;
  }

  .app-mobile-card__actions .btn {
    flex: 1 1 100%;
  }
}

/* Desktop: scroll hint yashirin */
@media (min-width: 768px) {
  .app-table-scroll-hint {
    display: none !important;
  }
}

@media (prefers-reduced-motion: no-preference) {
  .app-mobile-card {
    animation: appMobileCardIn 0.4s ease backwards;
  }

  .app-mobile-cards .app-mobile-card:nth-child(1) { animation-delay: 0.02s; }
  .app-mobile-cards .app-mobile-card:nth-child(2) { animation-delay: 0.05s; }
  .app-mobile-cards .app-mobile-card:nth-child(3) { animation-delay: 0.08s; }
}

@keyframes appMobileCardIn {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
