:root {
    --fk-cream: #fffaf1;
    --fk-surface: #ffffff;
    --fk-navy: #13233f;
    --fk-navy-soft: #203557;
    --fk-coral: #ff5a54;
    --fk-coral-dark: #e94a46;
    --fk-mint: #dff5eb;
    --fk-mint-strong: #55ccaa;
    --fk-sky: #dff1ff;
    --fk-sky-strong: #2e9fe8;
    --fk-yellow: #fff0bd;
    --fk-border: #e8e1d5;
    --fk-panel-radius: 3px;
    --bs-border-radius: var(--fk-panel-radius);
    --bs-border-radius-sm: var(--fk-panel-radius);
    --bs-border-radius-lg: var(--fk-panel-radius);
    --bs-border-radius-xl: var(--fk-panel-radius);
}

html, body { background: var(--fk-cream); color: var(--fk-navy); }
body { font-family: Lato, "Segoe UI", sans-serif; }

.app-header {
    background: var(--fk-surface);
    border-bottom: 1px solid #eee7dc;
    color: var(--fk-navy);
}
.brand { background: var(--fk-surface); }
.app-header .brand .brand-logo { padding: 8px 12px; }
.app-header .brand .brand-logo img { width: 145px; height: auto; max-width: 145px; max-height: 42px; object-fit: contain; border-radius: 8px; box-shadow: none; background: #fff; padding: 3px 8px; }
.app-header .menu-search { max-width: 420px; }
.app-header .menu-search-input {
    background: #fbfcff;
    border: 1px solid #dbe5f0;
    border-radius: 10px;
}
.app-header .menu-search-input .form-control,
.app-header .menu-search-input .input-group-text { background: transparent !important; border: 0; color: var(--fk-navy) !important; }
.app-header .menu-search-input .form-control { background: transparent !important; color: var(--fk-navy) !important; font-size: 15px; }
.app-header .menu-search-input .form-control::placeholder { color: var(--fk-placeholder); opacity: 1; }
.app-header .menu .menu-text { color: var(--fk-navy) !important; font-weight: 600; }
.app-header .menu-toggler .bar { background: var(--fk-coral); }
.app-header { height: 68px; }
.app-header .brand { height: 68px; }
.app-header .desktop-toggler { height: 68px; }
.app-header .menu-toggler { height: 68px; }
.futurekids-avatar { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border-radius: 50%; background: var(--fk-mint); color: var(--fk-navy); font-weight: 700; }
.app-header .user-menu-item { position: relative; }
.app-header .user-menu-trigger { border: 0; background: transparent; cursor: pointer; gap: 8px; }
.app-header .user-menu-trigger::-webkit-details-marker { display: none; }
.app-header .user-menu-trigger .user-menu-chevron { margin-left: 2px; font-size: 11px; color: #71829a; transition: transform .15s ease; }
.app-header .user-menu-item[open] .user-menu-chevron { transform: rotate(180deg); }
.app-header .user-menu-dropdown { position: absolute; top: calc(100% - 4px); right: 8px; min-width: 160px; padding: 6px; background: var(--fk-surface); border: 1px solid var(--fk-border); border-radius: 10px; box-shadow: 0 10px 24px rgba(19, 35, 63, .14); opacity: 0; visibility: hidden; transform: translateY(-4px); transition: opacity .15s ease, transform .15s ease, visibility .15s ease; z-index: 1040; }
.app-header .user-menu-item[open] .user-menu-dropdown { opacity: 1; visibility: visible; transform: translateY(0); }
.app-header .user-menu-dropdown form { margin: 0; }
.app-header .user-menu-logout { display: flex; align-items: center; gap: 9px; width: 100%; padding: 9px 10px; border: 0; border-radius: 7px; background: transparent; color: var(--fk-navy); font: inherit; font-size: 14px; text-align: left; cursor: pointer; }
.app-header .user-menu-logout:hover, .app-header .user-menu-logout:focus { background: var(--fk-mint); color: var(--fk-navy); outline: none; }
.app-header .user-menu-logout i { color: var(--fk-coral); }

/* One shared placeholder style, including focused fields and framework controls. */
:root {
    --fk-placeholder: #aeb5bf;
}

::placeholder {
    color: var(--fk-placeholder) !important;
    opacity: 1;
}

::-webkit-input-placeholder {
    color: var(--fk-placeholder) !important;
    opacity: 1;
}

:-moz-placeholder {
    color: var(--fk-placeholder) !important;
    opacity: 1;
}

::-moz-placeholder {
    color: var(--fk-placeholder) !important;
    opacity: 1;
}

:-ms-input-placeholder {
    color: var(--fk-placeholder) !important;
}

::-ms-input-placeholder {
    color: var(--fk-placeholder) !important;
}

.app-sidebar { background: #f8fbfb; color: var(--fk-navy); border-right-color: #e1ecea; }
.app-sidebar .app-sidebar-content { background: #f8fbfb; }
.app-sidebar .menu .menu-header { color: #5d7483 !important; font-size: 11px; letter-spacing: .08em; font-weight: 700; }
.app-sidebar .menu .menu-item .menu-link { color: var(--fk-navy) !important; font-size: 14px; min-height: 38px; }
.app-sidebar .menu .menu-item .menu-link .menu-icon { color: #8de0c1 !important; }
.app-sidebar .menu-item.active > .menu-link,
.app-sidebar .menu-item > .menu-link:hover { background: #eef8f5 !important; color: var(--fk-navy) !important; }
.app-sidebar .menu-item.active > .menu-link { background: #dff5eb !important; color: var(--fk-navy) !important; border-left: 0; box-shadow: inset 3px 0 0 var(--fk-mint-strong); }
.app-sidebar .menu-item.active > .menu-link .menu-icon { color: var(--fk-mint-strong) !important; }
.app-sidebar .menu .menu-item { padding-left: 12px; padding-right: 12px; }
.app-sidebar .menu-group { margin:3px 12px; }.app-sidebar .menu-group-toggle { display:flex;align-items:center;justify-content:space-between;width:100%;min-height:38px;padding:8px 10px;border:0;border-radius:9px;background:transparent;color:var(--fk-navy);font:inherit;font-size:14px;font-weight:400;text-align:left;cursor:pointer; }.app-sidebar .menu-group-toggle > span { display:flex;align-items:center;gap:10px; }.app-sidebar .menu-group-toggle > span > i { width:20px;color:var(--fk-mint-strong);font-size:16px;text-align:center; }.app-sidebar .menu-group-toggle:hover,.app-sidebar .menu-group-toggle:focus-visible { background:#eef8f5;outline:none; }.app-sidebar .menu-group-chevron { color:#708296;font-size:11px;transition:transform .15s ease; }.app-sidebar .menu-group.is-expanded .menu-group-chevron { transform:rotate(180deg); }.app-sidebar .menu-group-items { padding:2px 0 5px; }.app-sidebar .menu-group-items .menu-item { padding-right:0;padding-left:0; }.app-sidebar .menu .menu-group-items .menu-item .menu-link { padding-left:28px !important; }

/* The template's flex sidebar needs an explicit scroll container on short viewports. */
.app-sidebar .app-sidebar-content {
    height: 100%;
    min-height: 0;
    overflow-y: auto !important;
    overflow-x: hidden;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
}

@media (max-width: 991.98px) {
    .app-sidebar .app-sidebar-content {
        height: 100dvh;
        max-height: 100dvh;
        padding-bottom: calc(16px + env(safe-area-inset-bottom));
    }
}

.fk-image-dropzone {
    display: flex;
    width: 156px;
    height: 156px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    padding: 1rem;
    border: 2px dashed #9fdcca;
    border-radius: var(--fk-panel-radius);
    color: #26735f;
    background: #f3fcf8;
    cursor: pointer;
    text-align: center;
}
.fk-image-dropzone.is-dragover { border-color: #54cfa9; background: #e3f8ef; }
.fk-image-dropzone i { font-size: 2.2rem; }
.fk-image-dropzone span { color: #64748b; font-size: .875rem; }
.fk-event-image-gallery { display: flex; flex-wrap: wrap; gap: 1rem; }
.fk-event-image-tile { position: relative; width: 156px; height: 156px; margin: 0; overflow: hidden; border: 1px solid #e8dfd2; border-radius: var(--fk-panel-radius); background: #f7f1e9; }
.fk-event-image-tile img { width: 100%; height: 100%; object-fit: cover; }
.fk-event-image-remove { position: absolute; top: .5rem; right: .5rem; display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border: 0; border-radius: 50%; color: #fff; background: rgba(21, 58, 48, .86); }
.fk-event-image-remove:hover, .fk-event-image-remove:focus-visible { background: #123d31; }
.parent-event-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); gap: 1rem; }
.parent-event-card { display: flex; overflow: hidden; border: 1px solid #e8dfd2; border-radius: var(--fk-panel-radius); background: #fff; cursor: pointer; }
.parent-event-card:has(.parent-event-card-input:checked) { border-color: #e68b2c; box-shadow: 0 0 0 2px #ffe2c1; }
.parent-event-card-image { display: grid; grid-template-columns: 1fr; align-content: start; flex: 0 0 140px; gap: 2px; background: #f4eadf; }
.parent-event-card-image > img { grid-column: 1 / -1; width: 100%; height: 160px; object-fit: cover; }
.parent-event-gallery-trigger { display: block; height: 160px; padding: 0; border: 0; background: transparent; cursor: zoom-in; }
.parent-event-gallery-trigger img { width: 100%; height: 100%; object-fit: cover; }
.parent-event-card:not(:has(.parent-event-card-description[open])) .parent-event-card-image { height: 160px; overflow: hidden; }
.parent-event-gallery-dialog { position: relative; width: min(92vw, 980px); max-width: none; padding: 2.75rem 3.75rem 2rem; border: 0; border-radius: var(--fk-panel-radius); background: #172b4d; color: #fff; }
.parent-event-gallery-dialog::backdrop { background: rgba(12, 27, 49, .75); }
.parent-event-gallery-dialog img { display: block; width: 100%; max-height: 75vh; object-fit: contain; }
.parent-event-gallery-close, .parent-event-gallery-arrow { position: absolute; display: grid; width: 2.5rem; height: 2.5rem; place-items: center; border: 0; border-radius: 50%; color: #fff; background: rgba(255,255,255,.17); }
.parent-event-gallery-close { top: .75rem; right: .75rem; }
.parent-event-gallery-arrow { top: 50%; transform: translateY(-50%); }
.parent-event-gallery-arrow.is-previous { left: .75rem; }
.parent-event-gallery-arrow.is-next { right: .75rem; }
.parent-event-gallery-dialog p { margin: .75rem 0 0; text-align: center; }
.parent-event-card-content { display: flex; flex: 1; flex-direction: column; gap: .4rem; padding: 1rem; color: #172b4d; }
.parent-event-card-price { color: #bd6416; font-weight: 700; }
.parent-event-card-description summary { color: #63758f; font-size: .9rem; }
.parent-event-card-description span { display: block; margin-top: .4rem; color: #4b5563; font-size: .9rem; white-space: pre-line; }
.parent-payment-card-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 1rem; }
.parent-payment-card { display: flex; min-height: 128px; gap: 1rem; padding: 1.15rem; border: 1px solid #e8dfd2; border-radius: var(--fk-panel-radius); background: #fff; cursor: pointer; }
.parent-payment-card:has(.parent-payment-card-input:checked) { border-color: #e68b2c; box-shadow: 0 0 0 2px #ffe2c1; }
.parent-payment-card-icon { display: grid; flex: 0 0 2.75rem; width: 2.75rem; height: 2.75rem; place-items: center; border-radius: 50%; color: #bd6416; background: #fff0df; font-size: 1.15rem; }
.parent-payment-card-content { display: flex; flex-direction: column; gap: .3rem; color: #63758f; }
.parent-payment-card-content strong { color: #172b4d; font-size: 1.05rem; }
.parent-contract-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.parent-contract-overview { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1rem; }
.parent-contract-overview-card { display: flex; gap: .9rem; padding: 1.2rem; border: 1px solid #e8dfd2; border-radius: var(--fk-panel-radius); background: #fff; }
.parent-contract-overview-card > i { display: grid; flex: 0 0 2.5rem; width: 2.5rem; height: 2.5rem; place-items: center; border-radius: 50%; color: #bd6416; background: #fff0df; }
.parent-contract-overview-card div { display: flex; min-width: 0; flex-direction: column; gap: .2rem; }
.parent-contract-overview-card span, .parent-contract-overview-card small { color: #63758f; }
.parent-contract-overview-card strong { color: #172b4d; overflow-wrap: anywhere; }
.parent-contract-installments td, .parent-contract-installments th { vertical-align: middle; }
.parent-contract-sign-card { border-color: #ffcf9b; background: #fffaf5; }
.parent-contract-sign-card .card-body { display: grid; gap: 1rem; }
.parent-contract-sign-card form { max-width: 680px; }
.parent-contract-sign-card .form-control { min-width: 220px; }
@media (max-width: 767.98px) { .parent-contract-header { flex-direction: column; } .parent-contract-overview { grid-template-columns: 1fr; } }

#content { background: var(--fk-cream); }
.app-content { padding: 20px 28px 36px; min-height: 100vh; }
.page-header h1 { color: var(--fk-navy); font-weight: 700; }
.page-header { margin-bottom: 22px; }
.page-header h1 { font-size: 28px; letter-spacing: -.02em; }
.page-header p { font-size: 14px; }
.card, .modal-content, .dropdown-menu, .offcanvas, .mail-template-preview, .fk-tablist, .fk-family-lookup-dialog, .planning-palette { border-radius: var(--fk-panel-radius); }
.card { background: var(--fk-surface); border-color: var(--fk-border) !important; }
.card-header { color: var(--fk-navy); }
.text-muted { color: #66758d !important; }
.btn-primary { background-color: var(--fk-coral); border-color: var(--fk-coral); }
.btn-primary:hover, .btn-primary:focus { background-color: var(--fk-coral-dark); border-color: var(--fk-coral-dark); }
.badge.bg-warning { background: var(--fk-yellow) !important; color: var(--fk-navy) !important; }
.badge.bg-info { background: var(--fk-sky) !important; color: var(--fk-navy) !important; }
.text-warning { color: #d59b00 !important; }
.text-info { color: var(--fk-sky-strong) !important; }

/* Keep adjacent actions visually separate throughout the CRM. */
.btn + .btn { margin-left: .25rem; }
form > .btn + .btn, .d-flex > .btn + .btn { margin-left: .25rem; }

.list-group-item { border-color: #eee7dc; }
.table-responsive { border-radius: var(--fk-panel-radius); }
.table { border-collapse: separate; border-spacing: 0; border-radius: var(--fk-panel-radius); overflow: hidden; }
.table > :not(caption) > * > * { background-clip: padding-box; }
.badge { border-radius: 999px; font-weight: 600; padding: .4rem .65rem; }
.shadow-sm { box-shadow: 0 5px 18px rgba(19, 35, 63, .07) !important; }
.mail-template-preview { width: 100%; min-height: 620px; border: 1px solid var(--fk-border); border-radius: 10px; background: #fff; }

.fk-tabs { margin-top: 1.25rem; }
.fk-tablist { display: flex; gap: .25rem; overflow-x: auto; margin: 0 0 1rem; padding: .25rem; border: 1px solid var(--fk-border); border-radius: 12px; background: var(--fk-surface); scrollbar-width: thin; }
.fk-tab { flex: 0 0 auto; border: 0; border-radius: 8px; background: transparent; color: var(--fk-navy); font: inherit; font-weight: 600; padding: .6rem .85rem; white-space: nowrap; }
.fk-tab:hover, .fk-tab:focus-visible { background: var(--fk-sky); color: var(--fk-navy); outline: 2px solid var(--fk-sky-strong); outline-offset: 1px; }
.fk-tab[aria-selected="true"] { background: var(--fk-mint); color: var(--fk-navy); }
.fk-tabpanel[hidden] { display: none !important; }
.fk-payment-schedule-table { min-width: 1000px; }
.fk-payment-schedule-table th { white-space: nowrap; }
.fk-payment-amount { min-width: 7rem; }
.fk-payment-note-inline { margin-top: .25rem; color: #708296; font-size: .88em; white-space: normal; overflow-wrap: anywhere; }
.fk-payment-row-editor { padding: .8rem; border: 1px solid var(--fk-border); border-radius: var(--fk-panel-radius); background: var(--fk-surface); }
.fk-payment-schedule-editor[hidden] { display: none !important; }
.fk-payment-schedule-add { padding: 1rem; border: 1px solid var(--fk-border); border-radius: var(--fk-panel-radius); background: var(--fk-surface); }
.fk-family-lookup-trigger { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:calc(1.5em + .75rem + 2px); color:var(--fk-placeholder); text-align:left; background:#fff; }
.fk-family-lookup-trigger.is-selected { color:var(--fk-navy); }
.fk-family-lookup-trigger i { color:var(--fk-mint-strong); }
.fk-family-lookup-dialog { width:min(34rem, calc(100vw - 2rem)); margin:auto; padding:0; border:1px solid var(--fk-border); border-radius:14px; color:var(--fk-navy); box-shadow:0 18px 48px rgba(19,35,63,.24); }
.fk-family-lookup-dialog::backdrop { background:rgba(19,35,63,.38); }
.fk-family-lookup-dialog-header { display:flex; align-items:center; justify-content:space-between; padding:1rem 1rem .75rem; }
.fk-family-lookup-dialog > .form-control, .fk-family-lookup-dialog > .fk-family-lookup-hint, .fk-family-lookup-results { margin-left:1rem; margin-right:1rem; width:calc(100% - 2rem); }
.fk-family-lookup-hint { min-height:1.4rem; padding:.6rem 0; color:#708296; font-size:.9rem; }
.fk-family-lookup-results { max-height:min(48vh, 22rem); overflow-y:auto; padding-bottom:1rem; }
.fk-family-lookup-option { display:block; width:100%; padding:.7rem .8rem; border:0; border-radius:8px; background:transparent; color:var(--fk-navy); font:inherit; text-align:left; }
.fk-family-lookup-option-name,.fk-family-lookup-option-id { display:block; }.fk-family-lookup-option-id { margin-top:.08rem; color:#708296; font-size:.82rem; }
.fk-family-lookup-option:hover, .fk-family-lookup-option:focus-visible { background:var(--fk-mint); outline:none; }
.planning-month { display: grid; grid-template-columns: repeat(7, minmax(120px, 1fr)); gap: 1px; background: var(--fk-border); border: 1px solid var(--fk-border); }
.planning-weekday { padding: .65rem; background: var(--fk-navy); color: #fff; font-weight: 700; text-align: center; }
.planning-day { min-height: 120px; padding: .65rem; background: var(--fk-surface); color: var(--fk-navy); text-decoration: none; display: flex; flex-direction: column; gap: .3rem; }
.planning-day:hover { background: var(--fk-mint); color: var(--fk-navy); }.planning-day-muted { opacity: .55; }.planning-day small { background: var(--fk-sky); border-radius: 5px; padding: .2rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.planning-layout { display: grid; grid-template-columns: 220px minmax(850px, 1fr); gap: 16px; align-items: start; }.planning-palette { position: sticky; top: 18px; padding: 16px; background: #fff; border: 1px solid var(--fk-border); border-radius: 12px; }.planning-token { padding: .55rem; margin: .35rem 0; background: var(--fk-sky); border-radius: 7px; cursor: grab; }.planning-grid { overflow: auto; border: 1px solid var(--fk-border); background: #fff; }.planning-grid-head,.planning-grid-row { display: grid; grid-template-columns: 70px repeat(var(--planning-locations, 3), minmax(190px, 1fr)); min-width: 850px; }.planning-grid-head>div { padding: .7rem; background: var(--fk-navy); color: #fff; font-weight: 700; }.planning-grid-row>div { min-height: 78px; padding: .35rem; border-top: 1px solid var(--fk-border); border-right: 1px solid var(--fk-border); }.planning-slot { background: repeating-linear-gradient(0deg, #fff, #fff 38px, #fbfcff 39px); }.planning-term { padding: .38rem .5rem; background: var(--fk-mint); border-left: 4px solid var(--fk-mint-strong); border-radius: 5px; cursor: grab; }.planning-term small { display: block; color: #46566d; }
.planning-slot { position: relative; overflow: visible; }.planning-term { position: absolute; z-index: 2; top: .5rem; left: .35rem; right: .35rem; min-height: 61px; height: var(--term-height, auto); }
.planning-modal-handle { cursor: move; user-select: none; }
.planning-token[data-kind="group"] { background: color-mix(in srgb, var(--group-color, #DCEBFA) 48%, white); border: 1px solid color-mix(in srgb, var(--group-color, #DCEBFA) 72%, #718096); }
.planning-term-heading { display: flex; align-items: center; flex-wrap: wrap; gap: .45rem; }
.planning-term-groups { display: flex; flex-wrap: wrap; gap: .25rem; margin: 0; }
.planning-term-group { display: inline-block; padding: .08rem .35rem; border-radius: 4px; background: color-mix(in srgb, var(--group-color, #DCEBFA) 42%, white); border: 1px solid color-mix(in srgb, var(--group-color, #DCEBFA) 72%, #718096); color: var(--fk-navy); font-size: .78rem; line-height: 1.3; }
@media(max-width:991.98px){.planning-layout{grid-template-columns:1fr}.planning-palette{position:static}.planning-month{grid-template-columns:repeat(7,minmax(95px,1fr));overflow:auto}}

@media (min-width: 992px) {
    .app-sidebar { width: 224px; }
    .app-header .brand { width: 224px; }
    .app-content { margin-left: 224px; }
}

@media (max-width: 991.98px) {
    .app-content { padding: 84px 16px 24px; }
}
/* The CRM serves its own Font Awesome icon fonts from its static assets. */
@font-face {
    font-family: "Font Awesome 5 Brands";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("/webfonts/fa-brands-400.woff2") format("woff2");
}

@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 400;
    font-display: block;
    src: url("/webfonts/fa-regular-400.woff2") format("woff2");
}

@font-face {
    font-family: "Font Awesome 5 Free";
    font-style: normal;
    font-weight: 900;
    font-display: block;
    src: url("/webfonts/fa-solid-900.woff2") format("woff2");
}
.user-list-row { cursor: pointer; }
.user-list-row:hover, .user-list-row:focus { background-color: rgba(58, 145, 190, .08); outline: none; }
.planning-instructor-picker { border: 1px solid var(--fk-border); border-radius: 8px; max-height: 180px; overflow: auto; padding: 0; }.planning-instructor-picker button { display: block; width: 100%; border: 0; border-radius: 4px; padding: .1rem .35rem; text-align: left; background: transparent; font-size: .9rem; font-weight: 400; }.planning-instructor-picker button:hover { background: var(--fk-sky); }.planning-instructor-active { color: var(--fk-navy); font-weight: 400; }.planning-instructor-inactive { color: #8691a1; }.planning-instructor-empty { color: #8691a1; font-size: .85rem; padding: .1rem .35rem; }.planning-instructor-picker hr { width: 28px; margin: .15rem .35rem; border: 0; border-top: 1px solid var(--fk-border); }
.planning-instructor-assignment { margin-top: .25rem; }.planning-instructor-assigned { min-height: 2.1rem; border: 1px solid var(--fk-border); border-radius: 7px; }.planning-instructor-row { display: flex; align-items: center; justify-content: space-between; padding: .25rem .45rem; font-size: .9rem; }.planning-instructor-remove { border: 0; background: transparent; color: #a74828; font-size: 1.25rem; line-height: 1; }.planning-instructor-add { width: 2rem; height: 2rem; margin-top: .3rem; border: 1px solid var(--fk-border); border-radius: 50%; background: var(--fk-sky); font-size: 1.2rem; line-height: 1; }.planning-instructor-options { margin-top: .3rem; border: 1px solid var(--fk-border); border-radius: 7px; overflow: hidden; }.planning-instructor-options button { display: block; width: 100%; border: 0; background: #fff; color: #8691a1; padding: .25rem .45rem; text-align: left; font-size: .9rem; }.planning-instructor-options button:hover { background: var(--fk-sky); color: var(--fk-navy); }
.planning-instructor-add { display: block; margin: .3rem 0 0 auto; }
.planning-instructor-assigned { padding: .15rem; }
.planning-instructor-row { padding: .35rem .55rem; }
.planning-instructor-add { margin-top: .45rem; margin-bottom: .35rem; }
.planning-instructor-options { margin-top: .4rem; }
.planning-instructor-options button { padding: .35rem .55rem; }
.planning-event-picker{display:flex;align-items:center;gap:.5rem}.planning-event-picker label{white-space:nowrap}.planning-event-picker select{width:auto;min-width:16rem;max-width:min(32rem,100%)}
.planning-toolbar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:1rem}.planning-trash{display:grid;place-items:center;width:2.5rem;height:2.5rem;flex:0 0 auto;border:1px solid #c84b3c;border-radius:.5rem;color:#b9382b;background:#fff;cursor:pointer;transition:background-color .15s,color .15s,transform .15s}.planning-trash svg{width:1.35rem;height:1.35rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.planning-trash.is-drop-target,.planning-trash:focus-visible{background:#ffe2de;color:#8f2218;outline:2px solid #f4a49a;transform:scale(1.06)}.planning-trash-hint{position:absolute;z-index:5;top:calc(100% + .35rem);right:0;max-width:min(26rem,calc(100vw - 2rem));padding:.55rem .75rem;border:1px solid var(--fk-border);border-radius:.5rem;background:#fff;color:var(--fk-navy);box-shadow:0 4px 14px #14213d20}
.planning-hour-drop{position:relative;cursor:copy;touch-action:none}.planning-hour-drop.is-drop-target{background:var(--fk-sky);box-shadow:inset 0 0 0 2px #78acd5}
.table {
    --bs-table-bg: #fff;
    --bs-table-hover-bg: #fff8ef;
    border: 1px solid #e9e1d6;
    border-collapse: separate;
    border-spacing: 0;
    border-radius: var(--fk-panel-radius);
    overflow: hidden;
    vertical-align: middle;
}

.table thead th {
    background-color: #fbf8f2;
    border-bottom-color: #e9e1d6;
    color: #26364f;
    font-weight: 600;
}

.table tbody tr:last-child > * {
    border-bottom: 0;
}

.table-hover .js-row-link {
    cursor: pointer;
}

.finance-add-payment { min-height: 42px; display: inline-flex; align-items: center; justify-content: center; }
.document-template-pdf-preview{height:75vh;min-height:32rem}


.template-editor-form .template-editor-tab-panel {
    height: 500px;
    overflow: auto;
}

.template-editor-form .template-editor-tab-panel[data-fk-tab-panel="pdf"] {
    overflow: hidden;
}

.template-editor-form .template-editor-tab-panel[data-fk-tab-panel="pdf"] .document-template-pdf-preview {
    height: calc(100% - 2rem);
    min-height: 0;
}

.template-editor-resize-handle {
    display: flex;
    height: 18px;
    align-items: center;
    justify-content: center;
    color: #8a8179;
    cursor: ns-resize;
    touch-action: none;
    user-select: none;
}

.template-editor-resize-handle span {
    display: inline-flex;
    width: 44px;
    height: 14px;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    background: #e9e1d6;
    font-size: 12px;
    line-height: 1;
}

.template-editor-resize-handle:hover span,
.template-editor-resize-handle:focus-visible span {
    background: #d8c8b7;
}

@media (min-width: 992px) {
    .template-editor-layout {
        align-items: stretch;
        height: 100%;
        min-width: 0;
        overflow: hidden;
    }

    .template-variable-panel,
    .template-markdown-panel {
        display: flex;
        flex-direction: column;
        min-width: 0;
        min-height: 0;
    }

    .template-variable-list {
        flex: 1 1 auto;
        min-height: 0;
        height: 0;
        max-height: none;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        padding-right: .4rem;
        scrollbar-gutter: stable;
    }

    .template-markdown-panel > .d-flex[role="toolbar"] {
        flex: 0 0 auto;
    }

    .template-markdown-panel [data-markdown-source] {
        flex: 1 1 auto;
        height: 0;
        min-height: 0;
        overflow: auto;
        resize: none;
    }

    .template-markdown-panel .form-text {
        flex: 0 0 auto;
    }
}

@media (max-width: 991.98px) {
    .template-editor-layout {
        height: auto;
    }

    .template-variable-list {
        height: auto;
        max-height: 800px;
        overflow-y: auto;
        overflow-x: hidden;
        overscroll-behavior: contain;
        padding-right: .4rem;
        scrollbar-gutter: stable;
    }

    .template-markdown-panel [data-markdown-source] {
        min-height: 32rem;
    }
}
/* Shared PDF preview dialog for the CRM and parent portal. */
.fk-pdf-preview-dialog {
    width: min(1400px, calc(100vw - 48px));
    height: min(900px, calc(100dvh - 48px));
    max-width: none;
    max-height: none;
    margin: auto;
    padding: 0;
    overflow: hidden;
    border: 0;
    border-radius: var(--fk-panel-radius);
    background: #fff;
    box-shadow: 0 24px 80px rgba(19, 35, 63, .36);
}

.fk-pdf-preview-dialog::backdrop { background: rgba(19, 35, 63, .52); }
.fk-pdf-preview-header { display: flex; align-items: center; justify-content: space-between; gap: 18px; min-height: 72px; padding: 16px 22px; border-bottom: 1px solid var(--fk-border); }
.fk-pdf-preview-header h2 { margin: 0; color: var(--fk-navy); font-size: 22px; font-weight: 700; }
.fk-pdf-preview-close { display: grid; flex: 0 0 auto; width: 40px; height: 40px; place-items: center; border: 0; border-radius: 50%; background: #f1f3f5; color: #c96316; font-size: 22px; cursor: pointer; }
.fk-pdf-preview-close:hover, .fk-pdf-preview-close:focus-visible { background: #ffe2c3; outline: none; }
.fk-pdf-preview-body { height: calc(100% - 136px); background: #e9eef2; }
.fk-pdf-preview-body iframe { display: block; width: 100%; height: 100%; border: 0; }
.fk-pdf-preview-footer { display: flex; justify-content: flex-end; align-items: center; height: 64px; padding: 10px 22px; border-top: 1px solid var(--fk-border); }
.fk-pdf-preview-footer .btn { display: inline-flex; align-items: center; gap: 8px; }
.contract-document-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: .45rem; }
.contract-document-actions .btn {
    display: inline-flex;
    align-items: center;
    gap: .45rem;
    padding: .45rem .8rem;
    border-color: #d6a17e;
    border-radius: var(--fk-panel-radius);
    color: #8f4c28;
    font-size: .95rem;
    line-height: 1.35;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.contract-document-actions .btn i { color: #bd6c39; }
.contract-document-actions .btn:hover,
.contract-document-actions .btn:focus-visible {
    border-color: #bd6c39;
    background: #fff1e5;
    color: #713718;
}
.contract-document-actions .btn:focus-visible { box-shadow: 0 0 0 .2rem rgba(189, 108, 57, .18); }

@media (max-width: 575.98px) {
    .fk-pdf-preview-dialog { width: 100vw; height: 100dvh; border-radius: 0; }
    .fk-pdf-preview-header { min-height: 62px; padding: 11px 14px; }
    .fk-pdf-preview-header h2 { font-size: 18px; }
    .fk-pdf-preview-body { height: calc(100% - 122px); }
    .fk-pdf-preview-footer { height: 60px; padding: 9px 14px; }
    .fk-pdf-preview-footer .btn { width: 100%; justify-content: center; }
}
