﻿@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@600;700;800&family=Poppins:wght@400;500;600&display=swap');

:root {
    --rizfin-cream: #e9eeea;
    --rizfin-teal: #0d3f3e;
    --rizfin-copper: #b67d3e;
    --rizfin-gold: #d29a49;
    --rizfin-sage: #5a7d7b;
    --rizfin-white: #ffffff;
    --rizfin-charcoal: #2f3a3c;
    --rizfin-soft: #f5f7f6;
}

/* Base */
body {
    font-family: 'Poppins', sans-serif !important;
    font-size: 11px;
    color: var(--rizfin-charcoal);
    background-color: var(--rizfin-soft);
}

/* Headings */
h1, h2, h3, h4, h5, h6,
.content-header h1,
.card-title,
.module h2,
.nav-header {
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em;
    font-weight: 800 !important;
    color: var(--rizfin-charcoal);
}

/* Top bar */
.main-header,
.navbar {
    background-color: var(--rizfin-teal) !important;
    border: none !important;
    box-shadow: none !important;
}

/* Sidebar */
.main-sidebar,
.main-sidebar::before,
.sidebar,
.sidebar-dark-primary {
    width: 370px !important;
    background-color: var(--rizfin-teal) !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Main content alignment */
body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .content-wrapper,
body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-footer,
body:not(.sidebar-mini-md):not(.sidebar-mini-xs):not(.layout-top-nav) .main-header {
    margin-left: 370px !important;
}

/* Brand area */
.main-sidebar .brand-link {
    display: flex !important;
    align-items: center !important;
    height: 72px !important;
    min-height: 72px !important;
    padding: 12px 18px !important;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
}

.main-sidebar .brand-link .brand-image {
    max-height: 40px !important;
    width: auto !important;
    margin-right: 12px !important;
    background: transparent !important;
    box-shadow: none !important;
}

.main-sidebar .brand-link .brand-text {
    font-family: 'Montserrat', sans-serif !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em;
    color: var(--rizfin-white) !important;
    line-height: 1 !important;
}

/* Sidebar text */
.sidebar a,
.sidebar .nav-link,
.sidebar .nav-link p,
.sidebar .user-panel,
.nav-sidebar .nav-header {
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em;
    color: var(--rizfin-white) !important;
}

/* Sidebar section titles */
.nav-header {
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: unset !important;
    word-break: break-word !important;
    line-height: 1.3 !important;
    padding: 14px 16px 6px 16px !important;
    font-size: 11px !important;
    display: block !important;
}

/* Sidebar nav items */
.nav-sidebar .nav-link {
    padding: 9px 14px !important;
    margin: 2px 8px !important;
    border-radius: 6px !important;
    height: auto !important;
    overflow: visible !important;
    white-space: normal !important;
}

/* Allow nav link labels to wrap */
.nav-sidebar .nav-link p,
.sidebar .nav-link p {
    white-space: normal !important;
    word-break: break-word !important;
    line-height: 1.3 !important;
    display: block !important;
    overflow: visible !important;
    text-overflow: unset !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link {
    color: var(--rizfin-cream) !important;
}

.sidebar-dark-primary .nav-sidebar > .nav-item > .nav-link.active,
.nav-sidebar .nav-link.active {
    background-color: var(--rizfin-gold) !important;
    color: var(--rizfin-white) !important;
}

.nav-sidebar .nav-link:hover {
    background-color: rgba(210, 154, 73, 0.18) !important;
    color: var(--rizfin-white) !important;
}

/* Links */
a {
    color: var(--rizfin-teal);
}

a:hover {
    color: var(--rizfin-gold);
}

/* Cards */
.card {
    border-radius: 8px;
    border: 1px solid rgba(90, 125, 123, 0.25);
    box-shadow: 0 2px 8px rgba(13, 63, 62, 0.08);
}

.card-primary.card-outline {
    border-top-color: var(--rizfin-gold) !important;
}

/* Primary buttons */
.btn-primary,
.button,
input[type="submit"] {
    background-color: var(--rizfin-gold) !important;
    border-color: var(--rizfin-gold) !important;
    color: var(--rizfin-white) !important;
    text-transform: uppercase !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 700 !important;
    letter-spacing: 0.04em;
}

/* Add buttons */
.btn-success,
.object-tools .addlink,
a.addlink {
    background-color: var(--rizfin-sage) !important;
    border-color: var(--rizfin-sage) !important;
    color: var(--rizfin-white) !important;
}

/* Change buttons */
.btn-info,
.btn-secondary,
a.changelink {
    background-color: var(--rizfin-gold) !important;
    border-color: var(--rizfin-gold) !important;
    color: var(--rizfin-white) !important;
}

/* Delete buttons */
.btn-danger,
.deletelink,
input[type="submit"].deletelink,
a.deletelink {
    background-color: var(--rizfin-charcoal) !important;
    border-color: var(--rizfin-charcoal) !important;
    color: var(--rizfin-white) !important;
}

/* Neutral buttons */
.btn-default,
.btn-outline-secondary,
.historylink {
    background-color: var(--rizfin-cream) !important;
    border-color: var(--rizfin-cream) !important;
    color: var(--rizfin-teal) !important;
}

/* Tabs */
.nav-tabs .nav-link {
    color: var(--rizfin-teal) !important;
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    letter-spacing: 0.05em;
}

.nav-tabs .nav-link.active {
    color: var(--rizfin-gold) !important;
    border-top: 3px solid var(--rizfin-gold) !important;
}

/* Form focus */
.form-control:focus,
input:focus,
select:focus,
textarea:focus {
    border-color: var(--rizfin-gold) !important;
    box-shadow: 0 0 0 0.15rem rgba(210, 154, 73, 0.25) !important;
}

/* Autocomplete (select2) widget border â€” matches regular form inputs */
.select2-container--admin-autocomplete .select2-selection,
.select2-container .select2-selection--single,
.select2-container .select2-selection--multiple {
    border: 1px solid #ced4da !important;
    border-radius: 4px !important;
    min-height: 38px !important;
    padding: 4px 8px !important;
    display: flex !important;
    align-items: center !important;
}

.select2-container--admin-autocomplete .select2-selection:focus,
.select2-container--admin-autocomplete.select2-container--focus .select2-selection {
    border-color: var(--rizfin-gold) !important;
    box-shadow: 0 0 0 0.15rem rgba(210, 154, 73, 0.25) !important;
    outline: none !important;
}

/* Login page */
.login-page {
    background: url("/static/images/Full-Page Version of Cover Design.webp?v=2") no-repeat center center fixed !important;
    background-size: cover !important;
}

/* Remove Jazzmin login logo */
.login-logo,
.login-logo img {
    display: none !important;
}

/* Login card */
.login-card-body,
.card.card-outline.card-primary {
    background: rgba(255, 255, 255, 0.92) !important;
    border-radius: 12px !important;
    border-top: 4px solid var(--rizfin-gold) !important;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.18) !important;
}

/* Login welcome */
.login-box-msg {
    font-size: 0 !important;
}

.login-box-msg::before {
    content: "Welcome to RizFin Administration";

    display: block;

    font-family: 'Montserrat', sans-serif !important;

    text-transform: uppercase !important;

    letter-spacing: 0.06em !important;

    font-weight: 700 !important;

    color: var(--rizfin-teal) !important;

    font-size: 18px !important;
}

/* Login button */
.login-card-body .btn-primary {
    background-color: var(--rizfin-gold) !important;
    border-color: var(--rizfin-gold) !important;
    font-family: 'Montserrat', sans-serif !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
}
/* Replace Jazzmin footer text */
.login-page .text-center {
    font-size: 0 !important;
}

.login-page .text-center::after {
    content: "RizFin Financial Management System";

    font-size: 12px !important;

    font-family: 'Poppins', sans-serif !important;

    color: var(--rizfin-white) !important;

    letter-spacing: 0.04em;
}
/* Custom login footer text */
.login-page .login-box + div {
    font-size: 0 !important;
}


/* Collapsible sidebar section headers */
#jazzy-navigation .nav-header:hover {
    color: var(--rizfin-gold) !important;
    opacity: 0.9;
}

/* Lead â€” Mobile number: narrow country code input only, wide number field */
.model-lead .field-mobile_country_code input {
    width: 90px !important;
    min-width: 90px !important;
}
.model-lead .field-phone input {
    width: 200px !important;
}

/* Supplier â€” Documents inline: constrain columns to fit within the block */
#documents-group td.field-file {
    max-width: 160px;
    word-break: break-all;
    white-space: normal;
}
#documents-group td.field-file a,
#documents-group td.field-file span,
#documents-group td.field-file p {
    word-break: break-all;
    white-space: normal;
    display: block;
}
#documents-group td.field-file_link {
    max-width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#documents-group td.field-file_link a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#documents-group td.field-label,
#documents-group th.column-label {
    max-width: 140px;
}
#documents-group td.field-email_count,
#documents-group td.field-hours_per_email,
#documents-group td.field-video_call_count,
#documents-group td.field-hours_per_call,
#documents-group td.field-total_hours_display {
    width: 80px;
}

/* Lead â€” Attachments inline: constrain file and open columns so they don't overflow */
#attachments-group td.field-file {
    max-width: 200px;
    word-break: break-all;
    white-space: normal;
}
#attachments-group td.field-file a,
#attachments-group td.field-file span,
#attachments-group td.field-file p {
    word-break: break-all;
    white-space: normal;
    display: block;
}
#attachments-group td.field-file_link {
    max-width: 180px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
#attachments-group td.field-file_link a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Lead â€” Services of Interest inline */
#service_interests-group td.field-notes textarea {
    width: 100%;
    height: 38px;
    min-height: unset;
    max-height: 100px;
    resize: vertical;
    box-sizing: border-box;
}
#service_interests-group td {
    vertical-align: top;
    overflow: hidden;
}
#service_interests-group .tabular {
    overflow: hidden;
}

/* Lead - Activity Log inline (StackedInline) */
#activities-group .inline-related {
    border: 1px solid #e0e5e4;
    border-radius: 4px;
    margin-bottom: 6px;
    padding: 6px 10px;
    background: #fff;
}
#activities-group .inline-related h3 {
    font-size: 0.72rem !important;
    margin-bottom: 6px;
    padding-bottom: 3px;
    border-bottom: 1px solid #e0e5e4;
}
#activities-group .form-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 4px;
}
#activities-group .field-date        { flex: 0 0 260px; }
#activities-group .field-activity_type { flex: 0 0 120px; }
#activities-group .field-summary     { flex: 1 1 160px; }
#activities-group .field-notes       { flex: 1 1 100%; }
#activities-group .field-logged_by   { flex: 0 0 auto; font-size: 0.75rem; color: #777; align-self: flex-end; }
#activities-group .field-notes textarea {
    width: 100%;
    height: 48px;
    min-height: unset;
    max-height: 120px;
    resize: vertical;
    box-sizing: border-box;
}
#activities-group .delete-row { text-align: right; }
/* Date + Time inputs side by side */
#activities-group .datetime {
    display: flex;
    gap: 10px;
    align-items: flex-end;
    flex-wrap: nowrap;
}
#activities-group .datetime p { margin: 0; }
#activities-group p.datetime { display: flex; gap: 10px; align-items: flex-end; margin: 0; }

/* â”€â”€ Services list â€” column widths â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€â”€ */
.model-service #result_list th.column-code,
.model-service #result_list td.field-code,
.model-service #result_list th.column-client_type,
.model-service #result_list td.field-client_type,
.model-service #result_list th.column-category,
.model-service #result_list td.field-category {
    white-space: nowrap;
}

.model-service #result_list th.column-code,
.model-service #result_list td.field-code {
    min-width: 130px;
}


.model-service #result_list th.column-billable_badge,
.model-service #result_list td.field-billable_badge,
.model-service #result_list th.column-active_badge,
.model-service #result_list td.field-active_badge {
    white-space: nowrap;
    width: 90px;
    text-align: center;
}

.login-page .login-box + div::after {
    content: "Clarity, Compliance and Confidence.";

    display: block;

    margin-top: 14px;

    text-align: center;

    font-family: 'Poppins', sans-serif !important;

    font-size: 12px !important;

    font-weight: 500 !important;

    letter-spacing: 0.04em;

    color: rgba(255, 255, 255, 0.92) !important;
}

/* Filter bar: align all panels to the top */
#change-list-filters .d-flex {
    align-items: flex-start !important;
}

/* People Profile â€” Leave Policy: shorten dropdown */
.model-userprofile .field-leave_policy .related-widget-wrapper,
.model-userprofile .field-leave_policy select {
    max-width: 320px !important;
    width: 320px !important;
}

/* People Profile â€” normalise decimal field input widths and borders */
.model-userprofile .field-weekly_hours input,
.model-userprofile .field-max_annual_hours input {
    width: 200px !important;
    border: 1px solid #ced4da !important;
    border-radius: 4px !important;
    padding: 6px 10px !important;
    font-size: 13px !important;
    font-family: 'Poppins', sans-serif !important;
    color: var(--rizfin-charcoal) !important;
    background-color: #fff !important;
}

/* Clip the inline card so it never grows wider than its column */
.card.docs-inline {
    overflow: hidden !important;
    max-width: 100% !important;
}
.card.docs-inline .card-body {
    overflow-x: auto !important;
    padding: 0 !important;
}

/* Supplier Document inline â€” force table to stay within block */
#supplierdocument_set-group .table {
    table-layout: fixed !important;
    width: 100% !important;
    font-size: 12px !important;
}
#supplierdocument_set-group .table th,
#supplierdocument_set-group .table td {
    padding: 3px 4px !important;
    vertical-align: middle !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}
/* nth-child(1) is the hidden "original" column â€” collapse it */
#supplierdocument_set-group .table th:nth-child(1),  #supplierdocument_set-group .table td:nth-child(1)  { width: 22px; min-width: 22px; max-width: 22px; padding: 0 2px !important; }
/* Visible columns â€” sized to fit all without scrolling */
#supplierdocument_set-group .table th:nth-child(2),  #supplierdocument_set-group .table td:nth-child(2)  { width: 6%; }    /* Type */
#supplierdocument_set-group .table th:nth-child(3),  #supplierdocument_set-group .table td:nth-child(3)  { width: 10%; }   /* File */
#supplierdocument_set-group .table th:nth-child(4),  #supplierdocument_set-group .table td:nth-child(4)  { width: 8%; }    /* Label */
#supplierdocument_set-group .table th:nth-child(5),  #supplierdocument_set-group .table td:nth-child(5)  { width: 7%; }    /* Open */
#supplierdocument_set-group .table th:nth-child(6),  #supplierdocument_set-group .table td:nth-child(6)  { width: 55px; }   /* No. emails */
#supplierdocument_set-group .table th:nth-child(7),  #supplierdocument_set-group .table td:nth-child(7)  { width: 55px; }   /* Hrs/email */
#supplierdocument_set-group .table th:nth-child(8),  #supplierdocument_set-group .table td:nth-child(8)  { width: 55px; }   /* No. video calls */
#supplierdocument_set-group .table th:nth-child(9),  #supplierdocument_set-group .table td:nth-child(9)  { width: 55px; }   /* Hrs/call */
#supplierdocument_set-group .table th:nth-child(10), #supplierdocument_set-group .table td:nth-child(10) { width: 5%; }    /* Total hrs */
#supplierdocument_set-group .table th:nth-child(11), #supplierdocument_set-group .table td:nth-child(11) { width: 8%; }    /* Uploaded at */
#supplierdocument_set-group .table th:nth-child(12), #supplierdocument_set-group .table td:nth-child(12) { width: 3%; }    /* Delete */
/* Force all inputs to fit their cell â€” no browser minimum width */
#supplierdocument_set-group .table input,
#supplierdocument_set-group .table select {
    width: 100% !important;
    min-width: 0 !important;
    font-size: 11px !important;
    box-sizing: border-box !important;
}
/* Clip the native file input so "No file chosen" text doesn't force the column wide */
#supplierdocument_set-group .table input[type="file"] {
    width: 90px !important;
    max-width: 90px !important;
    overflow: hidden !important;
}
#supplierdocument_set-group .table input[type="file"]::file-selector-button {
    font-size: 10px !important;
    padding: 2px 4px !important;
}

/* Supplier Document stacked inline â€” fix label widths so inputs align */
#supplierdocument_set-group .form-row .field-box label {
    display: inline-block !important;
    width: 160px !important;
    min-width: 160px !important;
}

/* Align Hours/email and Hours/call inputs by fixing their label widths */
#supplierdocument_set-group .field-hours_per_email label,
#supplierdocument_set-group .field-hours_per_call label {
    display: inline-block !important;
    width: 120px !important;
    min-width: 120px !important;
}

