/* ============================================================
   CUSTOMER CARD — MOBILE ADAPTATION
   Breakpoints: 900px (tablet/compact), 767px (mobile)
   ============================================================ */

/* --- Tab navigation adaptation --- */
@media (max-width: 900px) {
  ul#navigation,
  ul#navigation2 {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 4px 6px 0 !important;
    scroll-padding-left: 6px;
    scroll-snap-type: x proximity !important;
    -webkit-overflow-scrolling: touch;
    justify-content: flex-start !important;
  }
  ul#navigation li,
  ul#navigation2 li {
    flex: 0 0 auto !important;
    min-width: max-content !important;
    scroll-snap-align: start !important;
  }
  ul#navigation li a:link,
  ul#navigation li a:visited,
  ul#navigation2 li a:link,
  ul#navigation2 li a:visited {
    width: auto !important;
    min-width: 82px !important;
    max-width: 180px !important;
    min-height: 44px !important;
    padding: 10px 12px !important;
    margin: 0 1px -1px 1px !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }
}

/* --- Hero section adaptation --- */
@media (max-width: 900px) {
  .erpds-customer-hero {
    padding: 12px var(--erpds-grid-padding-x-mobile) var(--erpds-grid-padding-y-mobile);
    gap: 14px;
    align-items: center;
  }
  .erpds-customer-hero-top { flex-wrap: wrap; }
  .erpds-hero-actions { order: 3; }
}

/* --- Stats strip adaptation --- */
@media (max-width: 900px) {
  .erpds-customer-stats {
    padding: var(--erpds-grid-padding-y-mobile) var(--erpds-grid-padding-x-mobile);
  }
}

/* --- Table block / Slider adaptation --- */
@media (max-width: 900px) {
  .slider_content_double {
    flex-direction: column;
    gap: 12px;
  }
  .slider_content_double > .table_block {
    flex: 1 1 100%;
    width: 100% !important;
  }
  .table_block {
    background: var(--erpds-surface);
    border: 1px solid var(--erpds-border);
    border-radius: var(--erpds-radius);
    margin: 8px 0 !important;
    padding: 4px 0;
  }
  .table_block .item > div {
    padding: 8px 12px !important;
    font-size: 14px;
    border-bottom: 1px solid var(--erpds-border);
    transition: var(--erpds-transition, all 0.2s ease);
  }
  .table_block .item:last-child > div {
    border-bottom: none;
  }
  .table_block .left_data {
    color: var(--erpds-text-faint) !important;
    font-size: 11.5px;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    font-weight: 600;
  }
}

/* --- Body grid adaptation --- */
@media (max-width: 900px) {
  .erpds-customer-body {
    grid-template-columns: 1fr;
    padding: 12px var(--erpds-grid-padding-x-mobile) 20px;
  }
  .erpds-customer-right {
    position: static;
  }
}

/* --- Specific Mobile (767px and below) — UX Polish & Compactness --- */
@media (max-width: 767px) {
    .erpds-sticky-bar {
        gap: 6px;
        padding: 6px 10px;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .erpds-sticky-bar__info {
        flex: 1 1 auto;
        min-width: 0;
        flex-wrap: nowrap;
    }
    .erpds-sticky-bar__name {
        max-width: clamp(120px, 38vw, 180px);
        font-size: 13px;
        line-height: 1.2;
    }
    .erpds-sticky-bar__id {
        display: none;
    }
    .erpds-sticky-bar__tiles {
        order: 3;
        flex: 1 1 100%;
        min-width: 0;
        overflow-x: auto;
        overflow-y: hidden;
        padding-bottom: 1px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .erpds-sticky-tile {
        min-width: 76px;
        padding: 4px 8px;
        scroll-snap-align: start;
    }
    .erpds-sticky-tile--hide-mobile {
        display: none;
    }
    .erpds-sticky-tile__lbl {
        font-size: 9px;
    }
    .erpds-sticky-tile__val {
        font-size: 12px;
    }
    .erpds-sticky-bar__actions {
        order: 2;
        margin-left: auto;
        gap: 4px;
    }
    .erpds-sticky-bar__actions .erpds-hero-btn {
        min-height: 32px;
        padding: 4px 9px;
        font-size: 12px;
        border-radius: 7px;
        gap: 4px;
        white-space: nowrap;
    }
    .erpds-sticky-bar__actions .erpds-hero-btn .fa {
        font-size: 12px;
    }
    .erpds-hero-btn--overdue {
        animation: none;
    }

    /* Hero / top controls */
    .erpds-customer-hero {
        flex-direction: row;
        padding: 9px var(--erpds-grid-padding-x-mobile) 10px;
        gap: 9px;
        align-items: flex-start;
    }
    .erpds-customer-hero-avatar {
        width: 44px;
        height: 44px;
        font-size: 18px;
    }
    .erpds-customer-hero-name {
        font-size: 17px;
        line-height: 1.2;
        overflow-wrap: anywhere;
    }
    .erpds-customer-hero-id {
        font-size: 10.5px;
        line-height: 1.4;
        overflow-wrap: anywhere;
    }
    .erpds-customer-hero-top {
        gap: 8px;
        align-items: stretch;
    }
    .erpds-hero-actions {
        width: 100%;
        max-width: 100%;
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .erpds-hero-actions .erpds-hero-btn {
        flex: 0 0 auto;
        min-height: 36px;
        padding: 7px 11px;
        font-size: 12px;
        scroll-snap-align: start;
    }
    .erpds-hero-bottom-row {
        gap: 6px;
        margin-top: 6px;
    }
    .erpds-hero-billing-row {
        flex: 0 1 auto;
        width: 100%;
        font-size: 10.5px;
        line-height: 1.35;
    }
    .erpds-tags-row {
        margin-top: 6px;
        gap: 5px;
        justify-content: flex-start;
    }
    .erpds-tag {
        font-size: 11px;
        padding: 2px 8px;
    }

    /* Main body and cards */
    .erpds-customer-body {
        gap: 10px;
        padding: 10px var(--erpds-grid-padding-x-mobile) 18px;
    }
    .erpds-card {
        padding: 12px;
    }
    .erpds-card__title-row {
        margin-bottom: 6px;
    }

    /* Stats / tiles */
    .erpds-customer-page .erpds-customer-stats {
        display: flex;
        overflow-x: auto;
        gap: 7px;
        padding-top: 7px;
        padding-bottom: 7px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .erpds-customer-page .erpds-customer-stats .erpds-stat-tile {
        flex: 0 0 136px;
        scroll-snap-align: start;
    }
    .erpds-customer-page .erpds-customer-stats--onu .erpds-stat-tile--wide {
        flex-basis: 188px;
    }

    /* Equipment / signal history */
    .erpds-equip-body {
        grid-template-columns: 1fr;
        gap: 10px;
        padding: 12px;
    }
    .erpds-equip-grid {
        gap: 3px 8px;
    }
    .erpds-signal-history {
        padding: 8px 12px 10px;
    }
    .erpds-signal-history__tabs {
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .erpds-sh-tab {
        white-space: nowrap;
        flex: 0 0 auto;
        scroll-snap-align: start;
    }

    /* Feed and links */
    .erpds-feed-items {
        max-height: 280px;
    }
    .erpds-feed-filters {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 2px;
        scrollbar-width: thin;
        scroll-snap-type: x mandatory;
        -webkit-overflow-scrolling: touch;
    }
    .erpds-feed-filter {
        white-space: nowrap;
        flex: 0 0 auto;
        scroll-snap-align: start;
    }
    .erpds-links-item {
        align-items: flex-start;
        flex-wrap: wrap;
        row-gap: 3px;
    }
    .erpds-links-item__name {
        flex: 1 1 100%;
        padding-left: 14px;
    }
    .erpds-links-until {
        margin-left: 0;
    }

    /* Actions / dangerous section */
    .erpds-actions-card summary {
        padding: 10px 12px;
        font-size: 12.5px;
    }
    .erpds-action-row {
        padding: 8px 12px;
        font-size: 12px;
    }
    .erpds-danger-footer {
        padding: 16px var(--erpds-grid-padding-x-mobile) 18px;
    }
    .erpds-danger-panel {
        max-width: none;
        padding: 12px;
    }
    .erpds-danger-cols {
        flex-direction: column;
        gap: 10px;
    }

    /* Card internals: label/value readability */
    .erpds-card__row {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 9px 0;
    }
    .erpds-card__label {
        min-width: 0;
        font-size: 10.5px;
        letter-spacing: 0.05em;
    }
    .erpds-card__value {
        width: 100%;
        text-align: left;
        font-size: 14px;
        overflow-wrap: anywhere;
    }

    /* IP/MAC card */
    .erpds-card-header {
        padding: 10px 12px;
        gap: 8px;
        flex-wrap: wrap;
        font-size: 12px;
    }
    .erpds-card-header strong {
        font-size: 12.5px;
    }
    .erpds-ipmac-body {
        padding: 10px 12px;
    }
    .erpds-ipmac__ip {
        font-size: 13px;
        overflow-wrap: anywhere;
    }
    .erpds-ipmac__subnets,
    .erpds-ipmac__macs {
        gap: 5px;
    }
    .erpds-ipmac__subnetline {
        overflow-wrap: anywhere;
    }

    /* Address card */
    .erpds-address-body {
        grid-template-columns: 1fr;
        gap: 12px;
        padding: 10px 12px 12px;
    }
    .erpds-address__main {
        font-size: 12.5px;
    }
    .erpds-address__sub {
        font-size: 11.5px;
    }
    .erpds-address__meta {
        grid-template-columns: 1fr;
        gap: 2px;
    }
    .erpds-address__meta-label {
        white-space: normal;
    }
    .erpds-address-map-btn {
        margin-left: 0;
        font-size: 11px;
        padding: 3px 8px;
    }
    .erpds-address-schema {
        padding: 10px;
    }
    .erpds-address-schema__row {
        gap: 6px;
    }
    .erpds-address-schema__node i {
        width: 28px;
        height: 28px;
        font-size: 13px;
    }
    .erpds-address-schema__line-label {
        font-size: 10px;
        text-align: center;
    }

    /* Links/notes compact spacing */
    .erpds-links-card .erpds-card__title-row {
        padding: 10px 12px;
    }
    .erpds-links-section {
        padding: 8px 12px;
    }
    .erpds-notes-card {
        padding: 10px 12px;
    }
    .erpds-notes-empty {
        padding: 8px 10px;
        font-size: 12px;
    }
}

/* Hit-area patch для sticky-bar: невидимый overlay расширяет touch zone до 44px
   по вертикали без изменения визуальной высоты — плотность нижнего bar сохранена. */
@media (max-width: 900px) {
    .erpds-sticky-bar__actions .erpds-hero-btn {
        position: relative;
    }
    .erpds-sticky-bar__actions .erpds-hero-btn::after {
        content: '';
        position: absolute;
        left: 0;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        height: 44px;
    }
}

/* Hit-area: .erpds-tag-add-btn — кликабельная кнопка добавления метки.
   На мобилке visual padding 1/8 даёт ~18px высоты — sub-44.
   Расширяем vertical padding до min-height ≈ 32px (компромисс компактности vs WCAG AA 24×24). */
@media (max-width: 900px) {
    .erpds-tag-add-btn {
        padding: 8px 12px;
        font-size: 12px;
    }
}