/*
 * Admin-wide utility classes.
 *
 * Replaces dozens of one-liner `style="..."` attributes that were
 * sprinkled through Blade views. Adding new utilities is fine; if
 * you find yourself reaching for `style="..."` in a Blade file,
 * either add a class here or use Bootstrap/Tabler's existing
 * utility instead (.d-none, .border-0, etc.).
 *
 * Rules of thumb:
 *   - Values that are constants: utility class belongs here.
 *   - Values interpolated from PHP (e.g. width: {{ $rate }}%): a
 *     style attribute is still acceptable. Prefer a CSS custom
 *     property (`--rate`) on the attribute when feasible.
 */

/* ── Sizing ────────────────────────────────────────────────────── */
.min-w-150 { min-width: 150px; }
.min-w-180 { min-width: 180px; }
.min-w-200 { min-width: 200px; }
.min-w-220 { min-width: 220px; }
.max-w-150 { max-width: 150px; }
.max-w-400 { max-width: 400px; }

/* Image thumbnail (square, cover-cropped). Used by datatable row
 * image cells where the source image varies in aspect ratio. */
.thumb-sm {
    width: 40px;
    height: 40px;
    object-fit: cover;
    border-radius: 4px;
}
.thumb-md {
    height: 48px;
    border-radius: 6px;
}

/* Hero / preview images that should center-fit within a card. */
.preview-img-centered {
    max-width: 400px;
    height: auto;
    margin: 0 auto;
    display: block;
}

/* Card-banner preview cap. */
.dashboard-banner-cap {
    max-height: 200px;
}

/* ── Tables ────────────────────────────────────────────────────── */
/* Label column in two-column "key: value" detail tables. ~14 usages
 * across admin/{stores,delivery_boys,withdrawals}/show + view pages. */
.table-label-col {
    width: 180px;
}

/* ── Whitespace + overflow ────────────────────────────────────── */
.whitespace-prewrap {
    white-space: pre-wrap;
}
.text-break-word {
    word-break: break-word;
}

/* Code-block / log-output preformatted area. */
.code-block {
    overflow: auto;
    font-size: 0.9rem;
}
.code-block-tall {
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 300px;
    overflow: auto;
}
.code-block-modal {
    max-height: 400px;
    overflow: auto;
    font-size: 0.9rem;
}

/* ── Progress + bars ──────────────────────────────────────────── */
.progress-slim {
    height: 6px;
}

/* ── Map overlays ──────────────────────────────────────────────── */
/* Place-autocomplete card floating in the upper-left of a maps iframe. */
.map-overlay-top-left {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 1000;
}
.map-canvas {
    height: 400px;
    width: 100%;
}
.map-canvas-tall {
    height: 500px;
}

/* ── Letter spacing (typography accents) ──────────────────────── */
.tracking-wide {
    letter-spacing: 0.04em;
}

/* ── Min-height (vertical rhythm in cards) ────────────────────── */
.min-h-3-2 {
    min-height: 3.2em;
}

/* ── Print page toolbar (used by the QR print page) ───────────── */
.print-toolbar-btn-primary {
    padding: 8px 20px;
    border-radius: 6px;
    border: 1px solid #0f172a;
    background: #0f172a;
    color: #fff;
    cursor: pointer;
}
.print-toolbar-btn-secondary {
    padding: 8px 20px;
    border-radius: 6px;
    border: 1px solid #cbd5e1;
    background: #fff;
    cursor: pointer;
}