/* ==========================================================================
   Friends Motors — Modern SaaS theme layer  (Bajaj blue, top-nav)
   Loaded AFTER adminlte.min.css + style.css. Overrides only look & feel.
   ========================================================================== */

:root {
    --fm-primary:        #1e56d6;
    --fm-primary-dark:   #1743aa;
    --fm-primary-darker: #143c9e;
    --fm-primary-050:    #eef3fe;
    --fm-primary-100:    #dbe6fd;

    --fm-bg:       #f4f6fa;
    --fm-surface:  #ffffff;
    --fm-border:   #e6eaf1;
    --fm-border-2: #eef1f6;

    --fm-text:   #1f2733;
    --fm-muted:  #6b7580;
    --fm-heading:#141a22;

    --fm-radius:    12px;
    --fm-radius-in: 8px;
    --fm-radius-sm: 6px;

    --fm-shadow:    0 1px 2px rgba(16,24,40,.04), 0 1px 3px rgba(16,24,40,.06);
    --fm-shadow-md: 0 4px 14px rgba(16,24,40,.08);
    --fm-shadow-lg: 0 20px 55px rgba(16,24,40,.20);

    --fm-ring: 0 0 0 3px rgba(30,86,214,.14);

    --fm-success:#1a7f45;
    --fm-warning:#a86400;
    --fm-danger: #c0392b;
    --fm-info:   #1668a8;
}

/* ---------- Base ---------------------------------------------------------- */
html, body {
    background: var(--fm-bg) !important;
}
body {
    font-family: "Inter", "Source Sans Pro", -apple-system, BlinkMacSystemFont,
                 "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif !important;
    color: var(--fm-text);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    letter-spacing: .1px;
}
.content-wrapper { background: transparent !important; }
.content-header h1, h1, h2, h3, h4, h5, h6 { color: var(--fm-heading); font-weight: 600; }
a { color: var(--fm-primary); }
a:hover { color: var(--fm-primary-darker); }
hr { border-top-color: var(--fm-border); }
::selection { background: var(--fm-primary-100); }

/* Thin modern scrollbars */
* { scrollbar-width: thin; scrollbar-color: #c9d2e0 transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: #cbd4e1; border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
*::-webkit-scrollbar-thumb:hover { background: #aeb9cc; background-clip: content-box; }

/* ---------- Top navbar  (teal -> Bajaj blue gradient) --------------------- */
.main-header.navbar,
.navbar-purple,
.main-header.navbar-dark {
    background: linear-gradient(90deg, #0f5c6b 0%, #14707f 26%, #1c63c8 72%, #1e56d6 100%) !important;
    border-bottom: none;
    box-shadow: 0 2px 10px rgba(15,40,80,.18);
}
.main-header.navbar { min-height: 58px; }

.navbar-dark .navbar-brand,
.navbar .brand-text {
    color: #ffffff !important;
    font-weight: 700;
    letter-spacing: .3px;
    text-shadow: 0 1px 2px rgba(0,0,0,.15);
}
.navbar-brand .brand-image {
    box-shadow: 0 0 0 2px rgba(255,255,255,.35) !important;
    opacity: 1 !important;
    border: none;
}

.main-header .container-fluid { padding-left: 14px; padding-right: 14px; }
.main-header .navbar-nav.ml-auto { margin-right: 0 !important; }

.main-header .navbar-nav .nav-link,
.navbar-dark .navbar-nav .nav-link {
    color: rgba(255,255,255,.9) !important;
    font-weight: 500;
    border-radius: 999px;
    padding: .38rem .55rem;
    transition: background .15s ease, color .15s ease;
    white-space: nowrap;
}
.main-header .navbar-nav .nav-link:hover,
.navbar-dark .navbar-nav .nav-link:hover,
.main-header .navbar-nav .nav-item:hover > .nav-link {
    color: #ffffff !important;
    background: rgba(255,255,255,.16);
}
.main-header .navbar-nav .nav-link.top-active,
.navbar-dark .navbar-nav .show > .nav-link {
    color: #0f4f8f !important;
    background: #ffffff;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(0,0,0,.14);
}
.navbar-dark .navbar-toggler {
    color: #fff;
    border-color: rgba(255,255,255,.4);
}
.navbar-dark .navbar-toggler-icon {
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255,255,255,0.95)' stroke-width='2' stroke-linecap='round' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}
.navbar .navbar-nav > .nav-item > a.nav-link[href*="logout"] {
    color: #fff !important;
    font-weight: 700;
    border: 1px solid rgba(255,255,255,.45);
    padding: .34rem .8rem;
    margin-left: .25rem;
}
.navbar .navbar-nav > .nav-item > a.nav-link[href*="logout"]:hover {
    background: rgba(255,255,255,.16);
}

/* ---------- Dropdown menus ------------------------------------------------- */
.dropdown-menu {
    border: 1px solid var(--fm-border);
    border-radius: 10px;
    box-shadow: var(--fm-shadow-md);
    padding: .35rem;
    margin-top: .4rem;
}
.dropdown-item {
    border-radius: var(--fm-radius-sm);
    padding: .45rem .7rem;
    font-size: .85rem;
    color: #3f4a57;
}
.dropdown-item:hover,
.dropdown-item:focus {
    background: var(--fm-primary-050);
    color: var(--fm-primary);
}
.dropdown-item.active, .dropdown-item:active {
    background: var(--fm-primary);
    color: #fff;
}
.dropdown-divider { border-top-color: var(--fm-border); }

/* ---------- Cards -------------------------------------------------------- */
.card {
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius);
    box-shadow: var(--fm-shadow);
    margin-bottom: 1rem;
}
.card-header {
    background: var(--fm-surface);
    border-bottom: 1px solid var(--fm-border);
    border-top-left-radius: var(--fm-radius);
    border-top-right-radius: var(--fm-radius);
    padding: .6rem .9rem;
    font-weight: 600;
    color: var(--fm-heading);
    min-height: 44px;
}
.card-header .card-title { font-weight: 600; font-size: .95rem; }
.card-footer {
    background: #fbfcfe;
    border-top: 1px solid var(--fm-border);
    border-bottom-left-radius: var(--fm-radius);
    border-bottom-right-radius: var(--fm-radius);
}
.card.card-outline { border-top-width: 3px; }
.card.card-primary:not(.card-outline) > .card-header { background: var(--fm-primary); }
.card.card-primary.card-outline { border-top-color: var(--fm-primary); }
.card > .card-body:first-child,
.card > .table:first-child { border-top-left-radius: var(--fm-radius); border-top-right-radius: var(--fm-radius); }

/* ---------- Buttons --------------------------------------------------------- */
.btn {
    border-radius: var(--fm-radius-in) !important;
    font-weight: 500;
    letter-spacing: .1px;
    transition: background .15s ease, box-shadow .15s ease, border-color .15s ease, transform .05s ease;
}
.btn:active { transform: translateY(1px); }
.btn:focus, .btn.focus { box-shadow: var(--fm-ring) !important; }

.btn-primary {
    background: var(--fm-primary);
    border-color: var(--fm-primary);
}
.btn-primary:hover, .btn-primary:focus, .btn-primary:active,
.btn-primary:not(:disabled):not(.disabled):active {
    background: var(--fm-primary-dark) !important;
    border-color: var(--fm-primary-dark) !important;
}
.btn-outline-primary { color: var(--fm-primary); border-color: var(--fm-primary); }
.btn-outline-primary:hover { background: var(--fm-primary); border-color: var(--fm-primary); }

.btn-secondary { background: #eef1f6; border-color: #e2e7ef; color: #3f4a57; }
.btn-secondary:hover { background: #e2e7ef; border-color: #d5dbe6; color: #2b333d; }

.btn-default {
    background: #fff; border-color: #d9e0ea; color: #3f4a57;
}
.btn-default:hover { background: #f4f6fa; border-color: #cdd6e2; }

.btn-success { background: #1a9e56; border-color: #1a9e56; }
.btn-success:hover { background: #158247; border-color: #158247; }
.btn-danger  { background: #e0483a; border-color: #e0483a; }
.btn-danger:hover  { background: #c73b2f; border-color: #c73b2f; }
.btn-info    { background: #1e88c7; border-color: #1e88c7; }
.btn-info:hover { background: #196fa3; border-color: #196fa3; }
.btn-warning { background: #f0a500; border-color: #f0a500; color: #3a2c00; }

.btn-link { color: var(--fm-primary); }

/* ---------- Forms -------------------------------------------------------- */
.form-control, .custom-select {
    border-radius: var(--fm-radius-in);
    border-color: #d9e0ea;
    color: var(--fm-text);
    transition: border-color .15s ease, box-shadow .15s ease;
}
.form-control:focus, .custom-select:focus {
    border-color: var(--fm-primary);
    box-shadow: var(--fm-ring);
}
.form-control::placeholder { color: #9aa4b2; }
label { color: #46505c; font-weight: 500; }

.input-group-text {
    border-radius: var(--fm-radius-in);
    background: #f4f6fa;
    border-color: #d9e0ea;
    color: var(--fm-muted);
}
.input-group > .input-group-prepend > .input-group-text { border-top-right-radius: 0; border-bottom-right-radius: 0; }
.input-group > .input-group-append  > .input-group-text { border-top-left-radius: 0;  border-bottom-left-radius: 0; }
.input-group > .form-control:not(:first-child) { border-top-left-radius: 0; border-bottom-left-radius: 0; }
.input-group > .form-control:not(:last-child)  { border-top-right-radius: 0; border-bottom-right-radius: 0; }

.custom-control-input:checked ~ .custom-control-label::before {
    background: var(--fm-primary);
    border-color: var(--fm-primary);
}

/* Legacy fieldset/legend from style.css — modernized */
fieldset {
    border: 1px solid var(--fm-border) !important;
    background: var(--fm-surface) !important;
    border-radius: 10px !important;
    padding: 8px 12px !important;
    margin-bottom: 12px !important;
}
legend {
    font-size: 13px !important;
    font-weight: 600 !important;
    color: var(--fm-primary) !important;
    background: var(--fm-primary-050) !important;
    border: 1px solid var(--fm-primary-100) !important;
    border-radius: 8px !important;
    padding: 3px 12px !important;
    width: auto !important;
    max-width: 60% !important;
}

/* Select2 to match inputs */
.select2-container--default .select2-selection--single {
    border-radius: var(--fm-radius-in) !important;
    border-color: #d9e0ea !important;
}
.select2-container--default.select2-container--focus .select2-selection--single,
.select2-container--default.select2-container--open .select2-selection--single {
    border-color: var(--fm-primary) !important;
    box-shadow: var(--fm-ring);
}
.select2-dropdown {
    border-color: var(--fm-border);
    border-radius: 10px;
    box-shadow: var(--fm-shadow-md);
    overflow: hidden;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background: var(--fm-primary);
}

/* ---------- Tables ------------------------------------------------------- */
.table thead th {
    background: #f7f9fc;
    color: #5b6470;
    text-transform: uppercase;
    font-size: .7rem;
    letter-spacing: .04em;
    font-weight: 700;
    border-bottom: 1px solid var(--fm-border) !important;
    border-top: 0 !important;
    vertical-align: middle;
}
.table td, .table th { border-top: 1px solid var(--fm-border-2) !important; }
.table-bordered, .table-bordered td, .table-bordered th { border-color: var(--fm-border) !important; }
.table-hover tbody tr { transition: background .12s ease; }
.table-hover tbody tr:hover { background: #f6f9ff !important; }
.table-striped tbody tr:nth-of-type(odd) { background: #fafbfd; }

.card > .table, .card > .table-responsive > .table { margin-bottom: 0; }
.card > .table-responsive {
    border-bottom-left-radius: var(--fm-radius);
    border-bottom-right-radius: var(--fm-radius);
}

/* DataTables controls */
.dataTables_wrapper .dataTables_filter input,
.dataTables_wrapper .dataTables_length select {
    border-radius: var(--fm-radius-in);
    border: 1px solid #d9e0ea;
    padding: .25rem .5rem;
}
.dataTables_wrapper .dataTables_filter input:focus { border-color: var(--fm-primary); box-shadow: var(--fm-ring); outline: 0; }
.paginate_button.current, .page-item.active .page-link {
    background: var(--fm-primary) !important;
    border-color: var(--fm-primary) !important;
    color: #fff !important;
}
.dt-buttons .btn { margin-right: .25rem; }

/* ---------- Pagination ------------------------------------------------------ */
.pagination { gap: 4px; }
.page-link {
    color: var(--fm-primary);
    border: 1px solid var(--fm-border);
    border-radius: var(--fm-radius-sm) !important;
    margin: 0;
}
.page-link:hover { background: var(--fm-primary-050); color: var(--fm-primary-darker); }
.page-item.disabled .page-link { color: #aab2bf; }

/* ---------- Badges ----------------------------------------------------------- */
.badge {
    font-weight: 600;
    padding: .38em .62em;
    border-radius: var(--fm-radius-sm);
    letter-spacing: .2px;
}
.badge-primary   { background: var(--fm-primary-050); color: var(--fm-primary); }
.badge-secondary { background: #eef1f6; color: #4b5563; }
.badge-success   { background: #e5f5ec; color: var(--fm-success); }
.badge-danger    { background: #fdecea; color: var(--fm-danger); }
.badge-warning   { background: #fdf1dd; color: var(--fm-warning); }
.badge-info      { background: #e4f1fb; color: var(--fm-info); }
.badge-light     { background: #f4f6fa; color: #4b5563; }

/* ---------- Stat boxes (small-box) — stylised --------------------------- */
/* neutralise legacy fixed sizing from style.css */
.small-box            { height: auto !important; width: 100% !important; margin: 0 0 1rem 0 !important; text-align: left !important; }
.small-box > .inner   { height: auto !important; }
.amount_area .small-box, .admin_client_info .small-box { width: 100% !important; }

.small-box {
    --acc:  #1e56d6;
    --acc2: #1743aa;
    --tint:  rgba(30,86,214,.055);
    --tint2: rgba(30,86,214,.12);
    --glow:  rgba(30,86,214,.16);

    background: #fff !important;
    color: var(--fm-text) !important;
    border: 1px solid var(--fm-border) !important;
    border-radius: 16px;
    box-shadow: var(--fm-shadow) !important;
    position: relative;
    overflow: hidden;
    outline: 0 !important;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.small-box.bg-danger, .small-box.bg-warning, .small-box.bg-info,
.small-box.bg-success, .small-box.bg-primary, .small-box.bg-secondary {
    border: 1px solid var(--fm-border) !important;
    box-shadow: var(--fm-shadow) !important;
}
.small-box::before {           /* top gradient strip */
    content: ""; position: absolute; left: 0; right: 0; top: 0; height: 4px;
    background: linear-gradient(90deg, var(--acc), var(--acc2));
}
.small-box::after {            /* soft corner glow */
    content: ""; position: absolute; right: -45px; top: -45px;
    width: 150px; height: 150px; border-radius: 50%;
    background: radial-gradient(circle at center, var(--glow), transparent 70%);
    pointer-events: none;
}
.small-box:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 30px rgba(16,24,40,.14) !important;
    border-color: var(--tint2) !important;
}

.small-box > .inner { padding: 20px 20px 16px; position: relative; z-index: 2; }
.small-box > .inner::after { content: none; }   /* kill AdminLTE clearfix spacing */
.small-box > .inner h3 {
    font-size: 2.5rem !important;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -1px;
    margin: 0 0 4px !important;
    color: var(--acc) !important;
    text-shadow: none !important;
}
.small-box > .inner p {
    margin: 0;
    font-size: .78rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .09em;
    color: var(--fm-muted) !important;
}

.small-box > .icon {
    display: flex !important;
    position: absolute !important; top: 16px !important; right: 16px !important; left: auto !important; bottom: auto !important;
    width: 52px; height: 52px; border-radius: 14px;
    align-items: center; justify-content: center;
    background: linear-gradient(135deg, var(--acc), var(--acc2)) !important;
    box-shadow: 0 10px 20px var(--glow);
    color: #fff !important;
    z-index: 4;
    transition: transform .2s ease;
    animation: none !important;
}
.small-box > .icon > i,
.small-box:hover > .icon > i,
.small-box > .icon > i.fa,
.small-box > .icon > i.fas,
.small-box > .icon > i.far,
.small-box > .icon svg {
    position: static !important;
    top: auto !important; right: auto !important;
    font-size: 22px !important;
    color: #fff !important;
    margin: 0 !important;
    animation: none !important;
}
.small-box:hover > .icon { transform: scale(1.07) rotate(-5deg); }

.small-box .small-box-footer {
    position: relative; z-index: 2;
    background: var(--tint) !important;
    border-top: 1px solid var(--fm-border-2);
    color: var(--acc) !important;
    font-weight: 700;
    font-size: .78rem;
    padding: .62rem;
    display: flex; align-items: center; justify-content: center; gap: 6px;
    transition: background .15s ease, gap .15s ease;
}
.small-box .small-box-footer:hover { background: var(--tint2) !important; gap: 11px; }
.small-box .small-box-footer i { transition: transform .15s ease; }
.small-box .small-box-footer:hover i { transform: translateX(3px); }

/* per-status accent palettes */
.small-box.bg-danger  { --acc:#ef4444; --acc2:#dc2626; --tint:rgba(239,68,68,.06);  --tint2:rgba(239,68,68,.14);  --glow:rgba(239,68,68,.18); }
.small-box.bg-warning { --acc:#f59e0b; --acc2:#d97706; --tint:rgba(245,158,11,.08); --tint2:rgba(245,158,11,.18); --glow:rgba(245,158,11,.20); }
.small-box.bg-info    { --acc:#0ea5e9; --acc2:#0284c7; --tint:rgba(14,165,233,.07); --tint2:rgba(14,165,233,.16); --glow:rgba(14,165,233,.18); }
.small-box.bg-success { --acc:#10b981; --acc2:#059669; --tint:rgba(16,185,129,.07); --tint2:rgba(16,185,129,.16); --glow:rgba(16,185,129,.18); }
.small-box.bg-primary { --acc:#1e56d6; --acc2:#1743aa; }

/* ---------- info-box (dashboard hero counter) -------------------------- */
.info-box {
    border: 1px solid var(--fm-border);
    border-radius: 16px;
    box-shadow: var(--fm-shadow);
    overflow: hidden;
}
.info-box .info-box-icon { border-radius: 14px 0 0 14px; }

.info-box.bg-gradient-primary,
.info-box.bg-primary {
    background: linear-gradient(135deg, #1e56d6 0%, #1b63c8 45%, #0f5c6b 100%) !important;
    border: none;
    box-shadow: 0 12px 30px rgba(20,60,120,.28);
    position: relative;
}
.info-box.bg-gradient-primary::after {
    content: ""; position: absolute; right: -35px; bottom: -50px;
    width: 180px; height: 180px; border-radius: 50%;
    background: radial-gradient(circle at center, rgba(255,255,255,.15), transparent 70%);
}
.info-box.bg-gradient-primary .info-box-icon {
    background: rgba(255,255,255,.16) !important;
    font-size: 1.7rem;
}
.info-box.bg-gradient-primary .info-box-text {
    text-transform: uppercase; letter-spacing: .07em; font-weight: 600; opacity: .92;
}
.info-box.bg-gradient-primary .info-box-number { font-size: 1.9rem; font-weight: 800; }

/* ---------- Alerts ------------------------------------------------------- */
.alert {
    border-radius: 10px;
    border: 1px solid transparent;
}
.alert-success { background: #e5f5ec; border-color: #bfe6cf; color: #14683a; }
.alert-danger  { background: #fdecea; border-color: #f5c6c0; color: #96271c; }
.alert-warning { background: #fdf1dd; border-color: #f3ddb3; color: #7a4b00; }
.alert-info    { background: #e4f1fb; border-color: #c2ddf3; color: #10527f; }

.toast { border-radius: 10px; box-shadow: var(--fm-shadow-md); }

/* ---------- Modals ----------------------------------------------------------- */
.modal-content {
    border: none;
    border-radius: 14px;
    box-shadow: var(--fm-shadow-lg);
    overflow: hidden;
}
.modal-header { border-bottom: 1px solid var(--fm-border); }
.modal-footer { border-top: 1px solid var(--fm-border); }

/* ---------- Nav pills / tabs --------------------------------------------- */
.nav-pills .nav-link.active,
.nav-pills .show > .nav-link { background: var(--fm-primary); border-radius: var(--fm-radius-in); }
.nav-tabs { border-bottom: 1px solid var(--fm-border); }
.nav-tabs .nav-link.active {
    color: var(--fm-primary);
    border-color: var(--fm-border) var(--fm-border) #fff;
    border-top: 2px solid var(--fm-primary);
}
.nav-tabs .nav-link:hover { border-color: transparent transparent var(--fm-border); }

/* ---------- Content header --------------------------------------------------- */
.content-header { padding: 14px .5rem 6px; }
.content-header h1 { font-size: 1.35rem; font-weight: 700; }
.breadcrumb { background: transparent; padding: 0; margin: 0; font-size: .8rem; }
.breadcrumb-item.active { color: var(--fm-muted); }

/* ---------- Footer --------------------------------------------------------- */
.main-footer {
    background: var(--fm-surface) !important;
    color: var(--fm-muted);
    border-top: 1px solid var(--fm-border);
    border-radius: 0;
}
.main-footer a, .main-footer strong { color: var(--fm-text); }

/* ---------- Login / register ------------------------------------------------ */
.login-page, .register-page { background: var(--fm-bg); }
.login-logo a, .register-logo a { color: var(--fm-primary); font-weight: 700; }
.login-box, .register-box { width: 400px; }
.login-card-body, .register-card-body {
    border-radius: var(--fm-radius);
    box-shadow: var(--fm-shadow-md);
    border: 1px solid var(--fm-border);
}
.login-box .card, .register-box .card { box-shadow: var(--fm-shadow-md); }

/* ---------- Misc --------------------------------------------------------- */
.text-primary { color: var(--fm-primary) !important; }
.bg-primary   { background-color: var(--fm-primary) !important; }
.border-primary { border-color: var(--fm-primary) !important; }
code { font-size: .85rem !important; background: #f4f6fa; padding: 2px 6px; border-radius: 6px; color: #b5316b; }
.close { transition: color .15s ease; }
.close:hover { color: var(--fm-danger); }

@media (max-width: 991.98px) {
    .main-header .navbar-nav .nav-link { padding: .5rem .6rem; }
    .navbar-collapse {
        background: #fff;
        border: 1px solid var(--fm-border);
        border-radius: 10px;
        margin-top: .5rem;
        padding: .4rem;
        box-shadow: var(--fm-shadow-md);
    }
}

@media print {
    .card { box-shadow: none; border-color: #ccc; }
}