/* ===================================================================
 * styles-misc-tail.css
 * Purpose: Gradient stat icons, catalog CC override, defensive iOS/footer responsive tweaks
 * Extracted from styles.css during the Apr 2026 split (task #23).
 * =================================================================== */
/* Professional Gradient Icons for Dashboard Cards */
.icon-container {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 70px !important;
    height: 70px !important;
    border-radius: 14px !important;
    margin-bottom: 1rem !important;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
    transition: transform 0.3s ease, box-shadow 0.3s ease !important;
    position: relative !important;
    flex-shrink: 0 !important;
}

.icon-container:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25) !important;
}

.gradient-icon {
    width: 40px !important;
    height: 40px !important;
    display: block !important;
    position: relative !important;
    z-index: 10 !important;
}

[data-theme="light"] .icon-container {
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1) !important;
}

[data-theme="light"] .icon-container:hover {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15) !important;
}

/* Hide any old Bootstrap icons in the card body */
.card-body .bi-bar-chart-line,
.card-body .bi-fire,
.card-body .bi-currency-dollar,
.card-body .bi-calendar-date {
    display: none !important;
}
/* Professional Gradient Icons for Project Stats */
.stat-icon-svg {
    width: 60px !important;
    height: 60px !important;
    display: block !important;
    margin: 0 auto !important;
}

/* CATALOG TABLE CC ROW ULTIMATE OVERRIDE - Gray background for currency column fix */
html body #catalogTable .catalog-cc-row,
html body #catalogTable tr.catalog-cc-row,
html body .catalog-table .catalog-cc-row,
html body .catalog-table tr.catalog-cc-row,
html body table.catalog-table .catalog-cc-row,
html body table#catalogTable .catalog-cc-row {
    background-color: #707070 !important;
    background: #707070 !important;
    color: #ffffff !important;
}

html body #catalogTable .catalog-cc-row td,
html body #catalogTable .catalog-cc-row th,
html body #catalogTable tr.catalog-cc-row td,
html body #catalogTable tr.catalog-cc-row th,
html body .catalog-table .catalog-cc-row td,
html body .catalog-table .catalog-cc-row th,
html body .catalog-table tr.catalog-cc-row td,
html body .catalog-table tr.catalog-cc-row th {
    background: transparent !important;
    background-color: transparent !important;
    color: #ffffff !important;
}

html body #catalogTable .catalog-cc-row td strong,
html body #catalogTable .catalog-cc-row .cc-code,
html body #catalogTable .catalog-cc-row .cc-description,
html body .catalog-table .catalog-cc-row td strong,
html body .catalog-table .catalog-cc-row .cc-code,
html body .catalog-table .catalog-cc-row .cc-description {
    color: #ffffff !important;
}

/* ═══════════════════════════════════════════════════════════════════
   RESPONSIVE FIXES — Task #16 audit (2026-04-17)
   Edits: defensive overflow guard, iOS zoom prevention, tap targets
   ═══════════════════════════════════════════════════════════════════ */

/* Defensive: prevent horizontal page scroll from any rogue absolutely-positioned element */
html, body { overflow-x: clip; }

/* iOS Safari zooms in on form fields with font-size < 16px when focused.
   Force 16px on phone/small-tablet widths across all forms. */
@media (max-width: 1024px) {
    input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]),
    select,
    textarea,
    .form-control,
    .form-select {
        font-size: 16px !important;
    }
}

/* Footer link tap-target sizing lives in styles-nav.css (Task #63). */
@media (max-width: 768px) {
    .cp-footer .container > div { gap: 0.25rem !important; }
}

/* Landing-page nav link tap targets */
@media (max-width: 768px) {
    .lp-nav-link {
        min-height: 44px;
        display: inline-flex;
        align-items: center;
    }
}