/* VORIK ADMIN - GLOBAL READABILITY */

:root {
    --admin-text: 16px;
    --admin-field: 16px;
    --admin-label: 14px;
    --admin-help: 13px;
    --admin-button: 16px;
    --admin-section: 17px;
    --admin-table: 14px;
}


/* ============================================================
   ADMIN BASE
   ============================================================ */

.admin-layout {
    font-size: 16px;
    line-height: 1.5;
}


/* ============================================================
   ADMIN FORMS
   ============================================================ */

.admin-layout input,
.admin-layout select,
.admin-layout textarea {
    font-size: 16px !important;
}

.admin-layout label {
    font-size: 14px !important;
}

.admin-layout button,
.admin-layout .btn,
.admin-layout .button {
    font-size: 16px;
}


/* ============================================================
   ADMIN PAGE TITLES
   ============================================================ */

.admin-layout main h1,
.admin-layout .admin-content h1,
.admin-layout .page-header h1,
.admin-layout .booking-operations__header h1 {
    font-size: clamp(32px, 3vw, 38px) !important;
    line-height: 1.12 !important;
}


/* ============================================================
   ADMIN SECTION TITLES
   ============================================================ */

.admin-layout main h2,
.admin-layout .admin-card h2,
.admin-layout .admin-section h2 {
    font-size: 17px;
    line-height: 1.3;
}


/* ============================================================
   ADMIN HELP TEXT
   ============================================================ */

.admin-layout .help-text,
.admin-layout .form-help,
.admin-layout .form-error,
.admin-layout .field-error {
    font-size: 13px !important;
}


/* ============================================================
   ADMIN TABLES
   ============================================================ */

.admin-layout table {
    font-size: 14px;
}

.admin-layout table th {
    font-size: 13px !important;
    line-height: 1.35;
}

.admin-layout table td {
    font-size: 14px !important;
    line-height: 1.45;
}


/* ============================================================
   ADMIN NAVIGATION
   ============================================================ */

.admin-sidebar,
.admin-sidebar a,
.admin-sidebar button,
.admin-layout .sidebar,
.admin-layout .sidebar a,
.admin-layout .sidebar button {
    font-size: 14px;
}


/* ============================================================
   ADMIN TOPBAR
   ============================================================ */

.admin-topbar,
.admin-topbar button,
.admin-topbar a {
    font-size: 14px;
}


/* ============================================================
   BOOKING PAGE
   ============================================================ */

.booking-operations__eyebrow {
    font-size: 12px !important;
}

.booking-operations__header p {
    font-size: 14px !important;
}

.booking-operations__live {
    font-size: 13px !important;
}


/* ============================================================
   BOOKING KPI
   ============================================================ */

.booking-kpi strong {
    font-size: 25px !important;
}

.booking-kpi span {
    font-size: 13px !important;
    line-height: 1.4;
}


/* ============================================================
   BOOKING FILTERS
   ============================================================ */

.booking-search input,
.booking-filters select,
.booking-filters input {
    font-size: 16px !important;
}

.booking-filter-button,
.booking-filter-reset {
    font-size: 15px !important;
}


/* ============================================================
   BOOKING TABLE
   ============================================================ */

.booking-table th {
    font-size: 12px !important;
}

.booking-table td {
    font-size: 14px !important;
    line-height: 1.45;
}

.booking-table td strong,
.booking-number {
    font-size: 14px !important;
}

.booking-service-badge,
.booking-tier {
    font-size: 11px !important;
}

.booking-route-point {
    font-size: 13px !important;
}

.booking-schedule {
    font-size: 12px !important;
}

.booking-resource-cell strong {
    font-size: 14px !important;
}

.booking-partner-name,
.booking-driver-name {
    font-size: 12px !important;
}

.booking-amount-cell strong {
    font-size: 15px !important;
}

.booking-status,
.booking-payment {
    font-size: 11px !important;
}


/* ============================================================
   BOOKING CARD TITLES
   ============================================================ */

.booking-table-card__header h2 {
    font-size: 18px !important;
}

.booking-table-card__header span {
    font-size: 13px !important;
}


/* ============================================================
   BOOKING PAGINATION
   ============================================================ */

.booking-pagination,
.booking-pagination a,
.booking-pagination span {
    font-size: 13px !important;
}


/* ============================================================
   ADMIN SECONDARY TEXT READABILITY
   ============================================================ */

.admin-layout small,
.admin-layout .text-muted,
.admin-layout .muted,
.admin-layout .secondary-text,
.admin-layout .help-text,
.admin-layout .meta,
.admin-layout .caption {
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #64748b !important;
}

.admin-layout article span,
.admin-layout section span {
    line-height: 1.4;
}


/* ============================================================
   BOOKING DRAWER
   ============================================================ */

.booking-drawer__header > div > span {
    font-size: 12px !important;
    color: #64748b !important;
}

.booking-drawer__body {
    font-size: 15px !important;
}

.booking-detail-card span,
.booking-detail-summary span {
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #64748b !important;
}

.booking-detail-card strong,
.booking-detail-summary strong {
    font-size: 14px !important;
    line-height: 1.4 !important;
    color: #0f172a !important;
}

.booking-detail-timeline strong,
.booking-timeline strong {
    font-size: 14px !important;
    color: #0f172a !important;
}

.booking-detail-timeline span,
.booking-timeline span,
.booking-detail-timeline small,
.booking-timeline small {
    font-size: 13px !important;
    line-height: 1.45 !important;
    color: #64748b !important;
}

.booking-status-history span,
.booking-detail-history span,
.booking-history span {
    font-size: 13px !important;
    line-height: 1.45 !important;
}

.booking-status-history strong,
.booking-detail-history strong,
.booking-history strong {
    font-size: 14px !important;
}

.booking-detail-notes span,
.booking-detail-notes small {
    font-size: 13px !important;
    color: #64748b !important;
}

.booking-detail-route span,
.booking-detail-route small {
    font-size: 13px !important;
    line-height: 1.45 !important;
}

.booking-detail-map span,
.booking-detail-map small,
.booking-detail-map button {
    font-size: 13px !important;
}

.booking-drawer button,
.booking-drawer__actions button,
.booking-drawer__actions a {
    font-size: 14px !important;
}


/* ============================================================
   TABLES — GLOBAL ADMIN READABILITY
   ============================================================ */

.admin-layout table th {
    font-size: 13px !important;
}

.admin-layout table td {
    font-size: 14px !important;
}

.admin-layout table td small,
.admin-layout table td span {
    font-size: 13px;
}


/* ============================================================
   FORMS — GLOBAL ADMIN STANDARD
   ============================================================ */

.admin-layout input,
.admin-layout select,
.admin-layout textarea {
    font-size: 16px !important;
}

.admin-layout label {
    font-size: 14px !important;
}


/* ============================================================
   NEVER ALLOW MICRO TEXT IN ADMIN
   ============================================================ */

.admin-layout small {
    font-size: 13px !important;
}


/* ============================================================
   BOOKING MICRO TEXT
   ============================================================ */

.booking-detail-live-status__state {
    font-size: 13px !important;
    line-height: 1.4 !important;
    color: #64748b !important;
    font-weight: 700;
}

.booking-detail-live-status__state i {
    width: 8px;
    height: 8px;
}


/* Definition-list labels */

.booking-drawer dt,
.booking-detail-card dt,
.booking-detail-section dt,
.booking-detail-grid dt {
    font-size: 13px !important;
    line-height: 1.4 !important;
    color: #64748b !important;
    font-weight: 700 !important;
}


/* Definition-list values */

.booking-drawer dd,
.booking-detail-card dd,
.booking-detail-section dd,
.booking-detail-grid dd {
    font-size: 14px !important;
    line-height: 1.45 !important;
    color: #0f172a !important;
}


/* Generic booking detail labels */

.booking-drawer .booking-detail-label,
.booking-drawer .booking-detail-meta,
.booking-drawer .booking-detail-caption {
    font-size: 13px !important;
    line-height: 1.4 !important;
    color: #64748b !important;
}

.booking-drawer small {
    font-size: 13px !important;
    line-height: 1.4 !important;
}


/* ============================================================
   MOBILE ADMIN / BOOKING
   ============================================================ */

@media (max-width: 768px) {

    .admin-layout {
        font-size: 16px;
    }

    .admin-layout main h1,
    .admin-layout .admin-content h1,
    .admin-layout .page-header h1 {
        font-size: 30px !important;
    }

    .admin-layout input,
    .admin-layout select,
    .admin-layout textarea {
        font-size: 16px !important;
    }

    .booking-drawer__body {
        font-size: 16px !important;
    }

    .booking-detail-timeline span,
    .booking-timeline span,
    .booking-detail-card span,
    .booking-detail-summary span {
        font-size: 13px !important;
    }

}

/* ============================================================
   VORIK ADMIN READABLE TYPOGRAPHY START
   ============================================================ */

:root {
    --vorik-admin-text: 16px;
    --vorik-admin-field: 16px;
    --vorik-admin-label: 14px;
    --vorik-admin-help: 13px;
    --vorik-admin-consent: 13px;
    --vorik-admin-button: 16px;
    --vorik-admin-section-title: 17px;
    --vorik-admin-page-title: clamp(
        32px,
        2.6vw,
        38px
    );
}


/* ============================================================
   NORMAL TEXT — 16px
   ============================================================ */

.admin-content,
.admin-content p,
.admin-content li,
.admin-content td,
.admin-content .admin-text,
.admin-content [class*="description"] {
    font-size:
        var(--vorik-admin-text);

    line-height: 1.5;
}


/* ============================================================
   FORM FIELDS — 16px
   ============================================================ */

.admin-content input,
.admin-content select,
.admin-content textarea {
    font-size:
        var(--vorik-admin-field)
        !important;

    line-height: 1.4;
}


.admin-content input:not([type="checkbox"]):not([type="radio"]),
.admin-content select {
    min-height: 44px;
}


.admin-content textarea {
    min-height: 96px;
}


/* ============================================================
   LABELS — 14px
   ============================================================ */

.admin-content label,
.admin-content .form-label,
.admin-content .field-label,
.admin-content [class*="field-label"],
.admin-content [class*="form-label"] {
    font-size:
        var(--vorik-admin-label)
        !important;

    line-height: 1.4;
}


/* ============================================================
   HELP / ERROR / SECONDARY TEXT — 13px
   ============================================================ */

.admin-content small,
.admin-content .help-text,
.admin-content .form-help,
.admin-content .form-error,
.admin-content .error-message,
.admin-content .invalid-feedback,
.admin-content [class*="help"],
.admin-content [class*="error"] {
    font-size:
        var(--vorik-admin-help)
        !important;

    line-height: 1.45;
}


/* ============================================================
   CONSENT — 13px
   ============================================================ */

.admin-content .consent,
.admin-content .consent label,
.admin-content [class*="consent"] {
    font-size:
        var(--vorik-admin-consent)
        !important;

    line-height: 1.45;
}


/* ============================================================
   BUTTONS — 16px
   ============================================================ */

.admin-content button,
.admin-content .btn,
.admin-content [class*="button"],
.admin-content input[type="submit"],
.admin-content input[type="button"] {
    font-size:
        var(--vorik-admin-button)
        !important;

    line-height: 1.25;
}


/* ============================================================
   SECTION TITLES — 17px
   ============================================================ */

.admin-content h2,
.admin-content h3,
.admin-content .section-title,
.admin-content [class*="section-title"],
.admin-content [class*="section__title"] {
    font-size:
        var(--vorik-admin-section-title);

    line-height: 1.35;
}


/* ============================================================
   MAIN PAGE TITLE — 32–38px
   ============================================================ */

.admin-content h1,
.admin-content .page-title,
.admin-content [class*="page-title"] {
    font-size:
        var(--vorik-admin-page-title);

    line-height: 1.12;

    letter-spacing:
        -.02em;
}


/* ============================================================
   TABLE READABILITY
   ============================================================ */

.admin-content table td {
    font-size: 15px !important;

    line-height: 1.45;
}


.admin-content table th {
    font-size: 14px !important;

    line-height: 1.35;

    letter-spacing:
        .02em;
}


/* ============================================================
   BADGES / STATUS / META
   Never allow operational information below 13px.
   ============================================================ */

.admin-content [class*="badge"],
.admin-content [class*="status"],
.admin-content [class*="meta"],
.admin-content [class*="helper"] {
    font-size: 13px;
}


/* ============================================================
   DRAWERS
   ============================================================ */

.admin-content [class*="drawer"] p,
.admin-content [class*="drawer"] td {
    font-size: 15px;
}


.admin-content [class*="drawer"] label {
    font-size: 14px;
}


.admin-content [class*="drawer"] h2,
.admin-content [class*="drawer"] h3 {
    font-size: 17px;
}


/* ============================================================
   MODALS
   ============================================================ */

.admin-content [class*="modal"] p {
    font-size: 16px;
}


.admin-content [class*="modal"] label {
    font-size: 14px;
}


/* ============================================================
   MOBILE / TABLET
   Keep form controls at 16px.
   ============================================================ */

@media (max-width: 768px) {

    .admin-content input,
    .admin-content select,
    .admin-content textarea {
        font-size: 16px !important;
    }


    .admin-content h1,
    .admin-content .page-title {
        font-size: 32px;
    }

}


/* ============================================================
   VORIK ADMIN READABLE TYPOGRAPHY END
   ============================================================ */
