/* ============================================================================
   B3-P3 — shared BUYER BODY reskin. One namespaced sheet (.dbody) that restyles
   the common Bootstrap patterns across the reskinned buyer pages (transactions,
   library, account/settings, FAQ/terms) so they match the DICE chrome + the P1
   catalogue. Pure reskin: Bootstrap tabs/collapse/popover, DataTables and every
   #id keep working — we only override appearance via descendant selectors on the
   existing markup. Wrap a page's body in <div class="dbody"> to opt in.
   Namespaced .dbody / .db-* so it never leaks into the shared chrome.
   ========================================================================== */

.dbody {
    max-width: 1080px;
    margin: 0 auto;
    padding: 8px 4px 48px;
    font-family: var(--font, inherit);
    color: var(--text, #333);
}

/* ---- page head ---------------------------------------------------------- */
.dbody .db-head { margin: 8px 0 22px; }
.dbody .db-head__title {
    font-size: var(--fs-h2, 28px);
    font-weight: var(--fw-heading, 800);
    line-height: var(--lh-heading, 1.15);
    color: var(--ink, #0B1B2B);
    letter-spacing: -0.01em;
    margin: 0 0 4px;
}
.dbody .db-head__sub { font-size: 14px; color: var(--muted, #595959); margin: 0; }
/* legacy .lead intros inside a reskinned body → treat as the page title */
.dbody > .row .lead, .dbody > .lead {
    font-size: var(--fs-h3, 22px); font-weight: var(--fw-heading, 800);
    color: var(--ink, #0B1B2B); margin-bottom: 18px;
}

/* ---- tab lanes (keeps .nav .nav-tabs structure for Bootstrap) ----------- */
.dbody .nav-tabs {
    border-bottom: 1px solid rgba(11, 27, 43, .12);
    display: flex; flex-wrap: wrap; gap: 2px; margin-bottom: 4px;
}
.dbody .nav-tabs > li { float: none; margin-bottom: -1px; }
.dbody .nav-tabs > li > a {
    border: 0; border-bottom: 2px solid transparent; border-radius: 0;
    margin-right: 0; padding: 12px 18px;
    color: var(--muted, #595959); font-weight: var(--fw-strong, 600); font-size: 14.5px;
    background: transparent; transition: color .15s ease, border-color .15s ease;
}
.dbody .nav-tabs > li > a:hover, .dbody .nav-tabs > li > a:focus {
    background: transparent; color: var(--ink, #0B1B2B); border-bottom-color: rgba(11, 27, 43, .25);
}
.dbody .nav-tabs > li.active > a,
.dbody .nav-tabs > li.active > a:hover,
.dbody .nav-tabs > li.active > a:focus {
    color: var(--accent-strong, var(--accent, #0B599C));
    border: 0; border-bottom: 2px solid var(--accent, #0B599C); background: transparent;
}
.dbody .tab-content { padding-top: 24px !important; }

/* ---- tables ------------------------------------------------------------- */
.dbody .table {
    margin-bottom: 20px;
    border: 1px solid rgba(11, 27, 43, .08);
    border-radius: var(--radius, 12px);
    overflow: hidden; background: #fff;
}
.dbody .table > caption {
    caption-side: top; padding: 2px 2px 14px;
    font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em;
    color: var(--muted, #595959);
}
.dbody .table > thead > tr > th {
    border-bottom: 1px solid rgba(11, 27, 43, .12);
    background: var(--bg-subtle, #F1F5FB);
    color: var(--muted, #595959);
    font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em;
    padding: 12px 16px;
}
.dbody .table > tbody > tr > td {
    border-top: 1px solid rgba(11, 27, 43, .06);
    padding: 13px 16px; vertical-align: middle;
    color: var(--ink, #0B1B2B); font-size: 14px;
}
.dbody .table.table-hover > tbody > tr:hover { background: var(--bg-subtle, #F1F5FB); }
.dbody .table a { color: var(--accent, #0B599C); text-decoration: none; }
.dbody .table a:hover { text-decoration: underline; }
/* nested/accordion tables read as a soft inset, not a second bordered card */
.dbody .table .table { border: 0; border-radius: 0; margin-bottom: 0; background: var(--bg-subtle, #F8FAFC); }
.dbody .hiddenRow { padding: 0 !important; }

/* ---- empty states ------------------------------------------------------- */
.dbody .description, .dbody .db-empty {
    background: var(--bg-subtle, #F1F5FB);
    border: 1px solid rgba(11, 27, 43, .08);
    border-radius: var(--radius, 12px);
    padding: 24px; color: var(--muted, #595959); font-size: 14.5px; line-height: 1.55;
}

/* ---- forms -------------------------------------------------------------- */
.dbody .form.well, .dbody .well {
    background: #fff; border: 1px solid rgba(11, 27, 43, .08);
    border-radius: var(--radius, 12px); box-shadow: none; padding: 28px; max-width: 760px;
}
.dbody legend {
    border: 0; font-size: var(--fs-h4, 18px); font-weight: var(--fw-heading, 800);
    color: var(--ink, #0B1B2B); margin-bottom: 10px; padding-bottom: 6px;
    border-bottom: 1px solid rgba(11, 27, 43, .08);
}
.dbody .control-label, .dbody label { font-weight: 600; color: var(--ink, #0B1B2B); }
.dbody .form-control {
    border: 1px solid var(--border-strong, #CBD2D9); border-radius: var(--radius, 8px);
    box-shadow: none;
}
.dbody .form-control:focus { border-color: var(--accent, #0B599C); box-shadow: 0 0 0 3px rgba(11,89,156,.12); }

/* ---- buttons pinned to DICE (primary white-on-accent; default = outline) - */
.dbody .btn-primary {
    background: var(--accent, #0B599C); border-color: var(--accent, #0B599C); color: #fff;
}
.dbody .btn-primary:hover, .dbody .btn-primary:focus {
    background: var(--accent-strong, #08487d); border-color: var(--accent-strong, #08487d); color: #fff;
}
.dbody .btn-default {
    background: #fff; border: 1px solid var(--border-strong, #CBD2D9); color: var(--ink, #0B1B2B);
}
.dbody .btn-default:hover, .dbody .btn-default:focus { background: var(--bg-subtle, #F1F5FB); border-color: var(--accent, #0B599C); color: var(--accent, #0B599C); }
.dbody .btn-link { color: var(--accent, #0B599C); }

@media (max-width: 600px) {
    .dbody .nav-tabs { gap: 0; }
    .dbody .nav-tabs > li > a { padding: 10px 12px; font-size: 13.5px; }
    .dbody .table > thead > tr > th, .dbody .table > tbody > tr > td { padding: 10px 10px; }
}

/* ---- panels (library media grids, etc.) --------------------------------- */
.dbody .panel { border: 1px solid rgba(11, 27, 43, .08); border-radius: var(--radius, 12px); box-shadow: none; background: #fff; margin-bottom: 20px; }
.dbody .panel-heading { background: transparent; border-bottom: 1px solid rgba(11, 27, 43, .06); padding: 14px 18px; border-radius: var(--radius, 12px) var(--radius, 12px) 0 0; }
.dbody .panel-title { font-size: var(--fs-h5, 15px); font-weight: 700; color: var(--ink, #0B1B2B); }
.dbody .panel-body { padding: 18px; }

/* ---- content pages (FAQ / terms / privacy) ------------------------------ */
.dbody h1, .dbody h2, .dbody h3, .dbody h4 { color: var(--ink, #0B1B2B); font-weight: var(--fw-heading, 800); }
.dbody h3 { font-size: var(--fs-h3, 22px); margin: 0 0 14px; }
.dbody #terms-and-conditions, .dbody #privacypolicy { font-size: 14.5px; line-height: 1.7; color: var(--text, #333); }
.dbody #terms-and-conditions h1, .dbody #terms-and-conditions h2, .dbody #privacypolicy h1, .dbody #privacypolicy h2 { font-size: var(--fs-h4, 18px); margin-top: 22px; }

/* QA (b): reskin the DataTables controls (filter / paginate / info / length) that the
   proposals & transaction tables add, so they match DICE not the legacy Bootstrap look. */
.dbody .dataTables_wrapper .dataTables_filter input,
.dbody .dataTables_wrapper .dataTables_length select { border: 1px solid var(--border-strong, #CBD2D9); border-radius: var(--radius, 8px); height: 34px; padding: 0 10px; font-family: var(--font); font-size: 13.5px; color: var(--ink, #0B1B2B); box-shadow: none; }
.dbody .dataTables_wrapper .dataTables_filter input:focus { border-color: var(--accent, #0B599C); outline: none; box-shadow: 0 0 0 3px rgba(11,89,156,.12); }
.dbody .dataTables_wrapper .dataTables_info,
.dbody .dataTables_wrapper .dataTables_filter,
.dbody .dataTables_wrapper .dataTables_length { font-size: 13px; color: var(--muted, #595959); padding: 8px 0; }
.dbody .dataTables_wrapper .dataTables_paginate .paginate_button { padding: 5px 11px; border-radius: var(--radius, 6px); border: 1px solid transparent; color: var(--accent, #0B599C) !important; }
.dbody .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dbody .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover { background: var(--accent, #0B599C); color: #fff !important; border-color: var(--accent, #0B599C); }
.dbody .dataTables_wrapper .dataTables_paginate .paginate_button:hover { background: var(--bg-subtle, #F1F5FB); border-color: var(--border, #E2E6EA); color: var(--accent, #0B599C) !important; }

/* QA body-deep: the legacy DataTables length menu ("Show 10 entries") + search ("Search:")
   read as un-reskinned chrome on the reskinned page — hide them (keep sorting + rowGroup +
   the DICE-styled pagination). The table body itself is already reskinned above. */
.dbody .dataTables_wrapper .dataTables_length,
.dbody .dataTables_wrapper .dataTables_filter { display: none; }
/* QA ride-along: drop the legacy "Showing X to Y of Z entries" footer (see messages-b3.css). */
.dbody .dataTables_wrapper .dataTables_info { display: none; }
