/* ------------------------------------------------------------------
   FinDistro — UI polish layer (loaded AFTER Inspinia app.min.css).
   Keep overrides scoped and minimal so theme updates stay easy.
   ------------------------------------------------------------------ */

/* --- Sidebar: tighter, cleaner menu density --- */
.sidenav-menu .side-nav .side-nav-link {
    padding: 6px 12px;
    font-size: 13px;
    line-height: 1.35;
    border-radius: 6px;
    transition: background-color .15s ease, color .15s ease;
}
.sidenav-menu .side-nav .menu-text {
    font-size: 13px;
    font-weight: 500;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.sidenav-menu .side-nav .menu-icon {
    font-size: 17px;
    min-width: 24px;
    margin-right: 6px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}
.sidenav-menu .side-nav .menu-icon i { font-size: 17px; }
.sidenav-menu .side-nav .menu-arrow { font-size: 14px; }

/* Section headings: less gap, refined */
.sidenav-menu .side-nav .side-nav-title {
    font-size: 10px;
    padding: 4px 12px 2px;
    margin-top: 6px;
    letter-spacing: .05em;
    text-transform: uppercase;
    opacity: .55;
}

/* Item rhythm + submenu indent */
.sidenav-menu .side-nav .side-nav-item { margin: 1px 6px; }
.sidenav-menu .side-nav .sub-menu .side-nav-link {
    padding: 5px 12px 5px 40px;
    font-size: 12.5px;
}

/* Sidebar user block */
.sidenav-menu .sidenav-user { padding-top: 10px; padding-bottom: 10px; }
.sidenav-menu .sidenav-user-name { font-size: 13px; }

/* --- Cards: subtle, smooth --- */
.card { border-radius: 10px; }
.card .card-title { font-size: 15px; }
.page-title-box h4 { font-size: 17px; }

/* Smooth focus/hover on interactive controls */
.btn, .side-nav-link, .dropdown-item { transition: all .15s ease; }

/* --- Page title (no breadcrumb, full-width layout) --- */
.page-title {
    font-size: 17px;
    font-weight: 600;
    letter-spacing: .01em;
    color: #1d2939;
}
.breadcrumb-item + .breadcrumb-item { padding-left: .5rem; }
.breadcrumb-item + .breadcrumb-item::before {
    content: "\203A";           /* › */
    padding-right: .5rem;
    color: var(--bs-tertiary-color, #adb5bd);
    font-weight: 600;
}
.breadcrumb-item a {
    color: var(--bs-secondary-color, #6c757d);
    text-decoration: none;
    display: inline-flex;
    align-items: center;
}
.breadcrumb-item a:hover { color: var(--bs-primary, #1ab394); }
.breadcrumb-item.active { color: var(--bs-emphasis-color, #212529); font-weight: 600; }
.breadcrumb-item .ti-home-2 { font-size: 15px; }

/* --- Card depth / premium surfaces --- */
.card {
    border: 1px solid var(--theme-border-color, rgba(16, 24, 40, .08));
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
}
.card .card-header {
    background-color: transparent;
    border-bottom: 1px solid var(--theme-border-color, rgba(16, 24, 40, .06));
    padding-top: .85rem;
    padding-bottom: .85rem;
}
.card .card-title { font-weight: 600; }

/* KPI stat cards: crisper icon + number rhythm */
.avatar-title { font-weight: 600; }

/* Full-width content layout (no max-width constraint) */

/* Tables: lighter header, comfortable rows */
.table-custom > thead th { font-weight: 600; letter-spacing: .03em; }

/* Nav tabs (detail pages) underline style refinement */
.nav-tabs.nav-bordered .nav-link.active { font-weight: 600; }

/* ==================================================================
   STAT TILES — KPI cards with colored icon + bottom accent
   ================================================================== */
.stat-tile {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--theme-border-color, #e7e9eb);
    border-radius: 10px;
    background: #fff;
    height: 100%;
    box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
    transition: box-shadow .15s ease, transform .15s ease;
}
.stat-tile:hover { box-shadow: 0 6px 16px rgba(16, 24, 40, .08); transform: translateY(-1px); }
.stat-tile .stat-body { padding: 1rem 1.1rem 1.15rem; }
.stat-tile .stat-label { font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: #8a92a6; }
.stat-tile .stat-value { font-size: 27px; font-weight: 700; color: #1d2939; line-height: 1.15; }
.stat-tile .stat-icon {
    width: 46px; height: 46px; border-radius: 11px;
    display: inline-flex; align-items: center; justify-content: center;
    color: #fff; font-size: 22px; flex-shrink: 0;
}
.stat-tile .stat-foot { font-size: 12px; color: #98a2b3; margin-top: .5rem; display: flex; align-items: center; }
.stat-tile .stat-foot .dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; margin-right: 6px; }
.stat-tile .stat-accent { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; }
.tile-teal   .stat-icon, .tile-teal   .stat-accent { background: #1ab394; } .tile-teal   .dot { background: #1ab394; }
.tile-blue   .stat-icon, .tile-blue   .stat-accent { background: #3a86ff; } .tile-blue   .dot { background: #3a86ff; }
.tile-cyan   .stat-icon, .tile-cyan   .stat-accent { background: #17c1d6; } .tile-cyan   .dot { background: #17c1d6; }
.tile-orange .stat-icon, .tile-orange .stat-accent { background: #f5a623; } .tile-orange .dot { background: #f5a623; }
.tile-red    .stat-icon, .tile-red    .stat-accent { background: #ef5350; } .tile-red    .dot { background: #ef5350; }
.tile-dark   .stat-icon, .tile-dark   .stat-accent { background: #3a4656; } .tile-dark   .dot { background: #3a4656; }
.tile-purple .stat-icon, .tile-purple .stat-accent { background: #7c5cff; } .tile-purple .dot { background: #7c5cff; }

/* ==================================================================
   FILTER PANEL
   ================================================================== */
.filter-card .card-header { font-weight: 600; }
.filter-card .form-label { font-size: 11px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #667085; margin-bottom: .25rem; }
.filter-actions .btn { min-width: 96px; }

/* ==================================================================
   DATA TABLE — dark header + tidy body (matches enterprise look)
   ================================================================== */
.table.table-dark-head > thead > tr > th {
    background: #26344a;
    color: #dfe5ee;
    border-color: #2f3e57;
    font-weight: 600;
    font-size: 11px;
    letter-spacing: .03em;
    text-transform: uppercase;
    vertical-align: middle;
    padding-top: .7rem; padding-bottom: .7rem;
}
.table.table-dark-head > thead > tr > th.dt-orderable-asc,
.table.table-dark-head > thead > tr > th.dt-orderable-desc { cursor: pointer; }
.table.table-dark-head > thead > tr > th .dt-column-title { color: #dfe5ee; }
.table.table-dark-head > tbody > tr > td { vertical-align: middle; }
.table.table-dark-head > tbody > tr:hover > td { background: #f7f9fc; }

/* Action buttons inside tables */
.table .btn-action { padding: .2rem .55rem; font-size: 12px; font-weight: 600; line-height: 1.4; }

/* ==================================================================
   TABLE-NEO — refined modern data table (All-Users directory etc.)
   ================================================================== */
/* Works WITH Bootstrap's .table (collapse borders) — no border-collapse override. */
.table.table-neo { --bs-table-bg: #ffffff; margin: 0; }
.table.table-neo > thead > tr > th {
    background: #f7f9fc;
    color: #5b6472;
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: .72rem 1rem;
    border-top: 0;
    border-bottom: 2px solid #e8ecf3;
    white-space: nowrap;
    vertical-align: middle;
}
.table.table-neo > tbody > tr > td {
    padding: .8rem 1rem;
    border-top: 0;
    border-bottom: 1px solid #f0f2f6;
    vertical-align: middle;
    font-size: 13px;
    color: #3f4a5a;
}
.table.table-neo > tbody > tr:last-child > td { border-bottom: 0; }
.table.table-neo > tbody > tr:hover > td { background: #f7faff; }
.table-neo .u-name { font-weight: 600; color: #1f2a3d; text-decoration: none; }
.table-neo .u-name:hover { text-decoration: underline; }
.table-neo .u-sub { font-size: 11px; color: #98a2b3; display: block; margin-top: 1px; }
.table-neo .u-mobile { font-weight: 700; color: #1f2a3d; letter-spacing: .01em; }
.table-neo .u-amt { font-variant-numeric: tabular-nums; font-weight: 600; color: #1f2a3d; }
.table-neo .u-amt.muted { color: #c0c6d0; font-weight: 400; }

/* Soft pill badges — cleaner than default */
.pill { display: inline-block; font-size: 11px; font-weight: 600; padding: .22rem .6rem; border-radius: 999px; line-height: 1.4; white-space: nowrap; }
.pill-green  { background: #e6f7f1; color: #0a9d6e; }
.pill-blue   { background: #e8f0fe; color: #2f6bd6; }
.pill-info   { background: #e4f4fb; color: #1090b8; }
.pill-orange { background: #fdf1e3; color: #d5820a; }
.pill-red    { background: #fdeaea; color: #d64545; }
.pill-grey   { background: #eef1f5; color: #667085; }
.pill-purple { background: #efeaff; color: #6b4ee0; }

/* Compact row action buttons */
.act-btns { display: inline-flex; gap: .35rem; justify-content: flex-end; }
.act-btns .btn { padding: .3rem .7rem; font-size: 12px; font-weight: 600; border-radius: 7px; line-height: 1.3; }

/* DataTables: keep the search/export toolbar tidy inside our card header */
.dt-toolbar .form-control-sm, .dt-toolbar .form-select-sm { min-height: 34px; }

/* DataTables chrome: search box + info + paging + export button */
div.dt-container .dt-search input {
    border: 1px solid #cfd4dc; border-radius: 6px; padding: .45rem .75rem .45rem 2rem; min-width: 240px; min-height: 38px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2398a2b3' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='8'/%3E%3Cpath d='m21 21-4.3-4.3'/%3E%3C/svg%3E") no-repeat .6rem center;
}
div.dt-container .dt-info { font-size: 12.5px; color: #667085; }
div.dt-container .dt-paging .dt-paging-button.current { background: #1ab394 !important; border-color: #1ab394 !important; color: #fff !important; border-radius: 6px; }
div.dt-container .dt-paging .dt-paging-button { border-radius: 6px; }
div.dt-container .dt-buttons .btn { border-radius: 6px; }

/* ==================================================================
   FORMS — clean, clearly-bordered fields (the theme's default border
   is too faint for a data-entry app). Applies app-wide.
   ================================================================== */
.form-label {
    font-weight: 600;
    font-size: 12.5px;
    color: #344054;
    margin-bottom: .375rem;
}
.form-control,
.form-select {
    border: 1px solid #cfd4dc;
    background-color: #fff;
    color: #1d2939;
    border-radius: 6px;
    padding: .5rem .75rem;
    min-height: 40px;
    font-size: 13.5px;
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control::placeholder { color: #98a2b3; opacity: 1; }
.form-control:hover:not(:disabled):not([readonly]),
.form-select:hover:not(:disabled) { border-color: #b3bac5; }
.form-control:focus,
.form-select:focus {
    border-color: #1ab394;
    box-shadow: 0 0 0 3px rgba(26, 179, 148, .14);
    background-color: #fff;
    color: #1d2939;
}
.form-control:disabled,
.form-control[readonly],
.form-select:disabled {
    background-color: #f2f4f7;
    color: #667085;
    border-color: #e4e7ec;
}
.form-control.is-invalid,
.form-select.is-invalid { border-color: #f04438; }
.form-control.is-invalid:focus { box-shadow: 0 0 0 3px rgba(240, 68, 56, .12); }
.invalid-feedback { font-size: 12px; color: #d92d20; }
.form-text { font-size: 12px; color: #667085; }

/* Input group affixes (icons) sit flush and subtle */
.input-group-text {
    background-color: #f9fafb;
    border: 1px solid #cfd4dc;
    color: #667085;
}
.input-group > .form-control { border-left: 0; }
.input-group > .input-group-text + .form-control { padding-left: .625rem; }

/* File inputs */
.form-control[type=file] { padding: .35rem .6rem; }
.form-control[type=file]::file-selector-button {
    background-color: #f2f4f7;
    border: 0;
    border-right: 1px solid #cfd4dc;
    color: #344054;
    padding: .45rem .75rem;
    margin: -.35rem .6rem -.35rem -.6rem;
    border-radius: 0;
}

/* Checkboxes / switches accent */
.form-check-input:checked { background-color: #1ab394; border-color: #1ab394; }

/* ==================================================================
   WIZARD (onboarding) — clean numbered stepper + sectioned panes
   ================================================================== */
.onboard-steps { border-bottom: 1px solid #e4e7ec; gap: .25rem; }
.onboard-steps .nav-link {
    color: #667085;
    font-weight: 600;
    font-size: 13px;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    background: transparent !important;
    padding: .5rem .25rem 1rem;
}
.onboard-steps .nav-link.active { color: #1ab394; border-bottom-color: #1ab394; }
.onboard-steps .nav-link [data-step-badge] {
    width: 22px; height: 22px; line-height: 22px; padding: 0;
    display: inline-flex; align-items: center; justify-content: center; font-size: 11px;
}
.onboard-pane { padding-top: .25rem; }
.onboard-pane .form-label { margin-bottom: .3rem; }

/* ── Service / category tab bar (commission + catalog switchers) ───────── */
.svc-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 0;
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem;
    border-bottom: 1px solid var(--bs-border-color, #e4e7ec);
}
.svc-tabs .nav-item { margin-bottom: -1px; }
.svc-tabs .nav-link {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 11px 20px;
    font-weight: 500;
    font-size: .9rem;
    line-height: 1.2;
    color: var(--bs-secondary-color, #667085);
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    white-space: nowrap;
    transition: color .15s ease, border-color .15s ease, background-color .15s ease;
}
.svc-tabs .nav-link i { font-size: 1.05rem; opacity: .9; }
.svc-tabs .nav-link:hover {
    color: var(--bs-emphasis-color, #1d2939);
    border-bottom-color: var(--bs-border-color, #cfd4dc);
}
.svc-tabs .nav-link.active {
    color: var(--bs-primary, #7c5cff);
    border-bottom-color: var(--bs-primary, #7c5cff);
    background: transparent;
}
@media (max-width: 575.98px) {
    .svc-tabs { flex-wrap: nowrap; overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .svc-tabs .nav-link { padding: 10px 14px; }
}

/* ── Breathing room below the sticky topbar on EVERY page ──────────────── */
.content-page > .container-fluid {
    padding-top: 1.5rem;
    padding-bottom: 1.75rem;
}
@media (max-width: 767.98px) {
    .content-page > .container-fluid { padding-top: 1rem; }
}
