/* ==========================================================================
   FinMinion page-level theme — list/detail/form pages, Radzen components,
   wizard, chat, calendar. Builds on tokens from fm-theme.css and is loaded
   after app.css / brand.css so it wins without needing broad !important.
   ========================================================================== */

/* ---------- Page frame ---------- */
.kanban-container { background: transparent; }
.kanban-container > .p-2 { padding: .75rem 1rem 1.25rem !important; }


/* app.css forces cards borderless — restore the template card */
.rz-card {
    border: 1px solid var(--fm-line-solid) !important;
    border-radius: var(--fm-radius) !important;
    box-shadow: var(--fm-shadow) !important;
    background: var(--fm-surface);
}
.rz-card > .rz-datatable { border: 0; }

/* Summary / stat cards used on Sales, Payments, Due payments */
.rz-card.text-center { padding: 1rem 1.1rem; }
.rz-card.text-center .fs-7 { font-weight: 600; letter-spacing: .01em; }
.rz-card.text-center .fw-bold.fs-5 { font-family: var(--fm-font-head); font-size: 1.5rem !important; font-weight: 800; }

/* ---------- Data grids ---------- */
.rz-datatable { border-radius: var(--fm-radius); overflow: hidden; }
.rz-datatable .rz-grid-table thead th,
.rz-datatable .rz-datatable-thead th {
    background: var(--fm-blue-tint);
    color: var(--fm-ink);
    font-size: .74rem; text-transform: uppercase; letter-spacing: .05em;
    border-bottom: 1px solid var(--fm-line-solid);
}
.rz-datatable .rz-grid-table thead th .rz-column-title,
.rz-datatable .rz-grid-table thead th strong { font-size: .74rem; font-weight: 800; letter-spacing: .05em; }
.rz-datatable .rz-grid-table tbody tr.rz-data-row:hover td { background: var(--fm-amber-tint); }
.rz-datatable .rz-grid-table td { border-color: var(--fm-line-solid); }
.rz-paginator { border-top: 1px solid var(--fm-line-solid); background: transparent; }
.rz-paginator .rz-paginator-page.rz-state-active,
.rz-paginator .rz-paginator-element.rz-state-active {
    background: linear-gradient(135deg, #1c2d52, var(--fm-navy-950)); color: #fff; border-radius: 8px;
}

/* ---------- Radzen badges → template status pills ---------- */
.rz-badge { border-radius: 999px; font-weight: 700; font-size: .72rem; padding: .28rem .65rem; text-transform: none; }
.rz-badge.rz-badge-success { background: var(--fm-green-tint); color: #2b6a0d; }
.rz-badge.rz-badge-danger  { background: var(--fm-red-tint);   color: #a92e46; }
.rz-badge.rz-badge-warning { background: var(--fm-amber-tint); color: var(--fm-gold-ink); }
.rz-badge.rz-badge-info    { background: var(--fm-blue-tint);  color: #0d4d8c; }
.rz-badge.rz-badge-primary { background: var(--fm-blue-tint);  color: #0d4d8c; }
.rz-badge.rz-badge-secondary,
.rz-badge.rz-badge-light   { background: rgba(134, 151, 168, .16); color: var(--fm-muted); }

/* ---------- Radzen buttons (secondary variants) ---------- */
.rz-button { font-weight: 600; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.rz-button.rz-info    { background: var(--fm-blue-tint);  color: #0d4d8c; border: 1px solid transparent; }
.rz-button.rz-success { background: var(--fm-green-tint); color: #2b6a0d; border: 1px solid transparent; }
.rz-button.rz-danger  { background: var(--fm-red-tint);   color: #a92e46; border: 1px solid transparent; }
.rz-button.rz-light   { background: var(--fm-surface);    color: var(--fm-ink); border: 1px solid var(--fm-line-solid); }
.rz-button.rz-info:hover:not(.rz-state-disabled)    { background: #d7e5f6; }
.rz-button.rz-success:hover:not(.rz-state-disabled) { background: #d4ebc4; }
.rz-button.rz-danger:hover:not(.rz-state-disabled)  { background: #f7ccd5; }
.rz-button.rz-light:hover:not(.rz-state-disabled)   { border-color: var(--fm-gold-2); }
.rz-button.rz-primary:hover:not(.rz-state-disabled) { transform: translateY(-1px); }
.rz-button.rz-button-icon-only { border-radius: 10px; }

/* ---------- Radzen inputs ---------- */
.rz-textbox, .rz-textarea, .rz-numeric, .rz-datepicker, .rz-password, .rz-dropdown, .rz-autocomplete, .rz-inputtext {
    border-color: var(--fm-line-solid); border-radius: 12px;
}
.rz-textbox:focus, .rz-textarea:focus, .rz-password:focus, .rz-inputtext:focus,
.rz-numeric:focus-within, .rz-datepicker:focus-within {
    border-color: var(--fm-gold-2); box-shadow: 0 0 0 4px rgba(211, 169, 66, .2); outline: 0;
}
.rz-label, .rz-form-field-label, label.form-label { font-weight: 700; font-size: .8rem; color: var(--fm-ink); }
.rz-messages-error, .rz-color-danger { font-size: .76rem; }

/* ---------- Dialogs / notifications ---------- */
.rz-dialog-wrapper .rz-dialog, .rz-dialog { border-radius: var(--fm-radius-lg); overflow: hidden; }
.rz-dialog-titlebar { background: var(--fm-surface); border-bottom: 1px solid var(--fm-line-solid); font-family: var(--fm-font-head); font-weight: 800; }
.rz-dialog-content { background: var(--fm-surface); }
.rz-notification-message { border-radius: 14px; box-shadow: var(--fm-shadow-lg); }

/* ---------- Tabs / steps ---------- */
.rz-tabview-nav li.rz-tabview-selected > a,
.rz-tabview-nav li.rz-state-active > a { color: var(--fm-gold-ink); border-bottom-color: var(--fm-gold-2); }
.rz-steps-item.rz-state-active .rz-steps-number { background: var(--fm-navy-950); color: #fff; }

/* ---------- Progress ---------- */
.rz-progressbar .rz-progressbar-value { background: linear-gradient(90deg, var(--fm-gold-deep), var(--fm-gold-2)); }
.progress .progress-bar.bg-success { background: linear-gradient(90deg, var(--fm-gold-deep), var(--fm-gold-2)) !important; }

/* ---------- Wizard (client / company profile, onboarding) ---------- */
.wizard-container { border: 1px solid var(--fm-line-solid); border-radius: var(--fm-radius-lg); box-shadow: var(--fm-shadow); background: var(--fm-surface); overflow: hidden; }
.wizard-header { background: var(--fm-blue-tint); border-bottom-color: var(--fm-line-solid); border-radius: 0; }
.wizard-nav-item.active, .wizard-nav-item.completed { color: var(--fm-gold-ink); }
.wizard-nav-item.active .nav-item-circle { background: linear-gradient(135deg, var(--fm-gold-1), var(--fm-gold-2)); color: #241a00; box-shadow: 0 6px 16px rgba(211, 169, 66, .4); }
.wizard-nav-item.completed .nav-item-circle { background: var(--fm-navy-950); color: #fff; }
.wizard-nav-item.completed:not(:last-child)::after { background: var(--fm-gold-2); }
.wizard-footer { border-top-color: var(--fm-line-solid); }
.upload-area { border-color: var(--fm-champagne); background: var(--fm-amber-tint); border-radius: var(--fm-radius); }

/* ---------- Notifications list ---------- */
.list-group-item { border-color: var(--fm-line-solid); background: var(--fm-surface); border-radius: 12px !important; }
.list-group-item .text-primary { color: var(--fm-gold-ink) !important; }

/* ---------- Calendar (RadzenScheduler) ---------- */
.rz-scheduler { border: 1px solid var(--fm-line-solid); border-radius: var(--fm-radius); overflow: hidden; background: var(--fm-surface); }
.rz-scheduler .rz-slot.rz-state-today, .rz-scheduler .rz-today { background: var(--fm-amber-tint); }
.rz-scheduler .rz-event { border-radius: 8px; }

/* ---------- Chat ---------- */
.chat-wrapper { background: var(--fm-surface); border: 1px solid var(--fm-line-solid); border-radius: var(--fm-radius-lg); box-shadow: var(--fm-shadow); margin: .5rem 1rem; }
.chat-sidebar { background: var(--fm-surface); border-right-color: var(--fm-line-solid); }
.chat-sidebar-header { font-family: var(--fm-font-head); font-weight: 800; border-bottom-color: var(--fm-line-solid); }
.chat-contact { border-bottom-color: var(--fm-line-solid); }
.chat-contact:hover { background: var(--fm-amber-tint); }
.chat-contact-active { background: var(--fm-blue-tint); box-shadow: inset 3px 0 0 var(--fm-gold-2); }
.chat-contact-avatar { background: linear-gradient(135deg, var(--fm-champagne), var(--fm-gold-deep)); color: #0b1426; font-family: var(--fm-font-head); }
.chat-main { background: var(--fm-canvas); }
.chat-header { background: var(--fm-surface); border-bottom: 1px solid var(--fm-line-solid); font-family: var(--fm-font-head); font-weight: 800; }
.chat-bubble-theirs { background: var(--fm-surface); border: 1px solid var(--fm-line-solid); color: var(--fm-ink); }
.chat-bubble-mine { background: linear-gradient(135deg, #1c2d52, var(--fm-navy-950)); color: #fff; }
.chat-send-btn { background: linear-gradient(135deg, var(--fm-gold-1), var(--fm-gold-2)); color: #241a00; }
.chat-input-pill { border-color: var(--fm-line-solid); }
.chat-task-badge { background: var(--fm-amber-tint); color: var(--fm-gold-ink); }

/* ---------- Document / compliance side panels ---------- */
.compliance-sidebar, .compliance-event-sidebar, .document-section {
    background: var(--fm-surface); border: 1px solid var(--fm-line-solid); border-radius: var(--fm-radius);
}

/* ---------- Dark mode touch-ups ---------- */
[data-bs-theme="dark"] .rz-datatable .rz-grid-table thead th { background: var(--fm-blue-tint); }
[data-bs-theme="dark"] .rz-button.rz-info { color: #8fbbe8; }
[data-bs-theme="dark"] .rz-button.rz-success { color: #8fd469; }
[data-bs-theme="dark"] .rz-button.rz-danger { color: #ff90a3; }

/* ---------- Responsive ---------- */
@media (max-width: 991.98px) {
    .chat-wrapper { margin: 0; border-radius: 0; }
    .chat-sidebar { width: 220px; }
}
@media (max-width: 575.98px) {
    .kanban-container > .p-2 { padding: .5rem !important; }
    .chat-sidebar { width: 84px; }
    .chat-contact-name, .chat-sidebar-header { display: none; }
    .rz-datatable { font-size: .85rem; }
}

/* ---------- Calendar page layout (replaces fixed 1200px / 500px widths) ---------- */
.fm-calendar { display: flex; flex-wrap: wrap; gap: 1rem; align-items: flex-start; padding: .5rem 1rem 1.25rem; }
.fm-calendar__main { flex: 1 1 560px; min-width: 0; }
.fm-calendar__side { flex: 0 1 380px; min-width: 260px; height: 700px; }
.fm-calendar__side h3 { font-size: 1.05rem; font-weight: 800; }
@media (max-width: 991.98px) {
    .fm-calendar { padding: .5rem; }
    .fm-calendar__side { flex: 1 1 100%; height: auto; max-height: 520px; }
}

/* ---------- Side drawers / misc responsive fixes ---------- */
.card.shadow.position-absolute.top-0.end-0 { max-width: 100%; border-radius: var(--fm-radius-lg); }
@media (max-width: 575.98px) {
    .d-flex.align-items-center.gap-2 > form.d-flex { flex-wrap: wrap; }
}

/* ---------- Empty / coming-soon state ---------- */
.fm-empty-state { text-align: center; padding: 3.5rem 1rem; }
.fm-empty-state > i { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 18px; font-size: 1.8rem; color: var(--fm-gold-ink); background: var(--fm-amber-tint); margin-bottom: 1rem; }
.fm-empty-state h5 { font-family: var(--fm-font-head); font-weight: 800; margin-bottom: .25rem; }
.fm-empty-state p { color: var(--fm-muted); margin: 0; }

/* ---------- Header island + menu: align accents with the template ---------- */
:root { --fm-gold: #d3a942; }
.fm-mark { background: linear-gradient(135deg, var(--fm-champagne), var(--fm-gold-deep)); color: #0b1426; box-shadow: 0 0 0 2px rgba(227, 205, 148, .6); }
.fm-mark:hover { box-shadow: 0 0 0 2px var(--fm-gold-2), 0 8px 18px rgba(184, 151, 63, .35); }
.fm-trigger__title, .fm-card__name, .fm-group__name { font-family: var(--fm-font-head); }
.fm-card.is-current { background: var(--fm-amber-tint); }
.fm-icon-btn__badge { background: linear-gradient(135deg, var(--fm-gold-1), var(--fm-gold-2)); color: #241a00; }
.fm-user__avatar { box-shadow: 0 0 0 2px rgba(227, 205, 148, .7); }


/* ===== Page audit fixes (checked page by page in the running app) ===== */

/* Grid headers: wrap long titles instead of cutting them ("CONTACT NUM…", "RAZORPAY R…") */
.rz-datatable .rz-grid-table thead th > div,
.rz-datatable .rz-grid-table thead th .rz-column-title,
.rz-datatable .rz-grid-table thead th .rz-column-title-content { white-space: normal; overflow: visible; text-overflow: clip; }
.rz-datatable .rz-grid-table thead th { vertical-align: middle; }

/* theme.min.css gives every element with class "active" a bright blue background — keep it off our components */
.wizard-nav-item.active, .wizard-nav-item.completed { background: transparent; }
.fm-ph .btn.active, .fm-ph .btn-phoenix-primary.active {
    background: linear-gradient(135deg, #f3dc9a, #d3a942); color: #241a00; border-color: transparent;
}

/* Tasks grid: the 460px Action column is frozen — below desktop width it leaves no room for the data, so let it scroll */
@media (max-width: 1279.98px) {
    .task-grid-horizontal .rz-frozen-cell-right { position: static !important; }
}

/* Documents page: folder list, chips and empty notice in the theme */
.mail-doc-body { margin: 0 1rem 1rem; border-color: var(--fm-line-solid); border-radius: var(--fm-radius); background: #fffdf9; box-shadow: var(--fm-shadow); }
.mail-folder-sidebar { background: #fbfaf6; border-right-color: var(--fm-line-solid); }
.mail-folder-item { color: var(--fm-ink); }
.mail-folder-item:hover { background: #f6f2e8; }
.mail-folder-item.active { background: #fbf3dc !important; color: var(--fm-gold-ink) !important; font-weight: 600; box-shadow: inset 3px 0 0 var(--fm-gold-2); }
.mail-folder-item.active i { color: var(--fm-gold-ink); }
.mail-doc-body { min-height: max(420px, calc(100vh - 300px)); }
.mail-folder-sidebar, .mail-doc-list, .mail-summary-panel { align-self: stretch; }
.mail-doc-list { background: transparent; }
.mail-event-chip { background: #f1f3f9; color: var(--fm-ink); }
.mail-event-chip.active { background: var(--fm-navy-950); color: #fff; }
.alert.alert-info { background: var(--fm-amber-tint); color: var(--fm-gold-ink); border: 1px solid rgba(211, 169, 66, .35); border-radius: 12px; }

/* Forms: a label and its control sat on one line, so a 100%-wide dropdown/date overflowed into the next column (New Sale) */
.rz-card [class*="col-"] > .rz-dropdown,
.rz-card [class*="col-"] > .rz-datepicker,
.rz-card [class*="col-"] > .rz-dropdown-panel-wrapper,
.rz-card [class*="col-"] > .rz-numeric,
.rz-card [class*="col-"] > .rz-textbox { display: flex; width: 100%; margin-top: .25rem; }

/* Client on-boarding: the card was 100% wide plus its margins, so it ran off the right edge */
.client-onboarding .co-card { width: auto !important; margin: .5rem 1rem 1rem !important; }

/* lists that render their grid straight into the page (Members) — give them the same card frame as the others */
.fm-page > .rz-datatable { margin: 0 1rem 1rem; border: 1px solid var(--fm-line-solid); border-radius: var(--fm-radius); box-shadow: var(--fm-shadow); background: #fffdf9; }
