@media (min-width: 1024px) {
    .biodesk-user-form .fi-main {
        margin-left: 0;
        margin-right: auto;
    }
}

.tool-card { width: min(46rem, 100%); margin-inline: auto; padding: clamp(1.5rem, 4vw, 3rem); border: 1px solid rgb(229 231 235); border-radius: 1rem; background: white; box-shadow: 0 1px 3px rgb(0 0 0 / .06); }
.dark .tool-card { border-color: rgb(63 63 70); background: rgb(24 24 27); }
.tool-intro { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; }
.tool-icon { display: grid; place-items: center; flex: 0 0 auto; width: 3rem; height: 3rem; border-radius: .75rem; background: rgb(5 150 105); color: white; font-size: 1.5rem; }
.tool-intro h2 { margin: 0 0 .25rem; font-size: 1.4rem; font-weight: 700; }
.tool-intro p, .tool-privacy, .tool-field small { margin: 0; color: rgb(107 114 128); }
.tool-error { margin-bottom: 1rem; padding: .8rem 1rem; border: 1px solid rgb(254 202 202); border-radius: .65rem; background: rgb(254 242 242); color: rgb(153 27 27); }
.tool-form { display: grid; gap: 1rem; }
.tool-drop { display: grid; gap: .35rem; padding: 2.25rem 1.25rem; border: 2px dashed rgb(167 243 208); border-radius: .85rem; background: rgb(236 253 245); text-align: center; cursor: pointer; }
.tool-drop:hover { border-color: rgb(5 150 105); }
.tool-drop span { color: rgb(107 114 128); font-size: .85rem; overflow-wrap: anywhere; }
.tool-drop input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.tool-field { display: grid; gap: .4rem; font-weight: 600; }
.tool-field select { min-height: 2.65rem; padding: .5rem .75rem; border: 1px solid rgb(209 213 219); border-radius: .55rem; background: white; }
.tool-field small { font-weight: 400; }
.tool-submit { min-height: 2.75rem; padding: .65rem 1rem; border-radius: .6rem; background: rgb(5 150 105); color: white; font-weight: 700; cursor: pointer; }
.tool-submit:hover { background: rgb(4 120 87); }
.tool-submit:disabled { opacity: .5; cursor: not-allowed; }
.tool-privacy { margin-top: 1rem; text-align: center; font-size: .8rem; }
.dark .tool-drop { border-color: rgb(6 95 70); background: rgb(6 78 59 / .18); }
.dark .tool-field select { border-color: rgb(82 82 91); background: rgb(39 39 42); }
.sync-warning { display: grid; gap: .2rem; margin: 1rem 0; padding: .85rem 1rem; border: 1px solid rgb(253 230 138); border-radius: .65rem; background: rgb(255 251 235); color: rgb(146 64 14); font-size: .9rem; }
.sync-warning strong { font-weight: 700; }
.dark .sync-warning { border-color: rgb(146 64 14); background: rgb(120 53 15 / .2); color: rgb(253 230 138); }

.price-list { display: grid; gap: 1rem; width: 100%; }
.price-list-page-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.price-list-last-sync { color: rgb(107 114 128); font-size: .8rem; white-space: nowrap; }
.price-list-last-sync strong { color: rgb(75 85 99); font-weight: 700; }
.dark .price-list-last-sync { color: rgb(161 161 170); }
.dark .price-list-last-sync strong { color: rgb(212 212 216); }
.price-list-toolbar { display: grid; gap: .4rem; max-width: 64rem; }
.price-list-toolbar label { font-weight: 700; }
.price-list-search { display: flex; gap: .6rem; }
.price-list-search input { flex: 1; min-width: 0; min-height: 2.6rem; padding: .55rem .8rem; border: 1px solid rgb(209 213 219); border-radius: .55rem; background: white; }
.price-list-search button, .price-list-pagination button { padding: .55rem 1rem; border-radius: .55rem; background: rgb(5 150 105); color: white; font-weight: 700; }
.price-list-export { display: inline-flex; align-items: center; justify-content: center; gap: .45rem; min-height: 2.6rem; padding: .55rem 1rem; border: 1px solid rgb(209 213 219); border-radius: .55rem; background: white; color: rgb(17 24 39); font-weight: 700; white-space: nowrap; }
.price-list-export:hover { border-color: rgb(5 150 105); color: rgb(5 150 105); }
.price-list-export svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.7; }
.price-list-presentation { display: flex; align-items: center; gap: .55rem; font-weight: 700; white-space: nowrap; }
.price-list-presentation select { min-height: 2.6rem; min-width: 15rem; padding: .5rem 2.2rem .5rem .75rem; border: 1px solid rgb(209 213 219); border-radius: .55rem; background: white; }
.price-list-search button:hover, .price-list-pagination button:hover { background: rgb(4 120 87); }
.price-list-pagination button:disabled { opacity: .45; cursor: not-allowed; }
.price-list-status { color: rgb(107 114 128); font-size: .9rem; }
.price-list-table-wrap { width: 100%; overflow-x: auto; border: 1px solid rgb(209 213 219); border-radius: .65rem; background: white; }
.price-list-table { width: 100%; min-width: 850px; border-collapse: collapse; font-size: .86rem; }
.price-list-table th { padding: .55rem .7rem; background: rgb(30 41 59); color: white; text-align: left; white-space: nowrap; }
.price-list-table td { padding: .52rem .7rem; border-bottom: 1px solid rgb(229 231 235); }
.price-list-table tbody tr:nth-child(even) { background: rgb(248 250 252); }
.price-list-table .numeric { text-align: right; white-space: nowrap; }
.price-list-table .price { font-weight: 700; }
.price-list-pagination { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .55rem; }
.price-list-page-numbers { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: .35rem; }
.price-list-pagination .price-list-page-button { display: grid; place-items: center; min-width: 2.45rem; min-height: 2.45rem; padding: .45rem .65rem; border: 1px solid rgb(209 213 219); background: white; color: rgb(55 65 81); }
.price-list-pagination .price-list-page-button:hover { border-color: rgb(5 150 105); background: rgb(236 253 245); color: rgb(4 120 87); }
.price-list-pagination .price-list-page-button.is-current { border-color: rgb(5 150 105); background: rgb(5 150 105); color: white; opacity: 1; cursor: default; }
.price-list-page-gap { min-width: 1.5rem; color: rgb(107 114 128); text-align: center; }
.dark .price-list-search input, .dark .price-list-presentation select, .dark .price-list-export, .dark .price-list-table-wrap { border-color: rgb(82 82 91); background: rgb(39 39 42); }
.dark .price-list-export { color: white; }
.dark .price-list-export:hover { border-color: rgb(52 211 153); color: white; }
.dark .price-list-table tbody tr:nth-child(even) { background: rgb(24 24 27); }
.dark .price-list-table td { border-color: rgb(63 63 70); }
.dark .price-list-pagination .price-list-page-button { border-color: rgb(82 82 91); background: rgb(39 39 42); color: rgb(228 228 231); }
.dark .price-list-pagination .price-list-page-button:hover { border-color: rgb(52 211 153); background: rgb(6 78 59 / .3); color: rgb(167 243 208); }
.dark .price-list-pagination .price-list-page-button.is-current { border-color: rgb(16 185 129); background: rgb(5 150 105); color: white; }
@media (max-width: 760px) { .price-list-page-header { align-items: flex-start; flex-direction: column; } .price-list-last-sync { white-space: normal; } .price-list-search { flex-direction: column; } .price-list-presentation { align-items: stretch; flex-direction: column; gap: .4rem; } .price-list-presentation select { min-width: 0; width: 100%; } }

/* Security administration */
.security-module { display: grid; gap: 1.25rem; width: 100%; }
.security-overview, .security-panel { overflow: hidden; border: 1px solid #e2e8f0; border-radius: 1rem; background: #fff; box-shadow: 0 1px 2px rgb(15 23 42 / .04), 0 4px 14px rgb(15 23 42 / .04); }
.security-overview { display: grid; grid-template-columns: minmax(280px, 1fr) minmax(480px, 1.15fr); align-items: stretch; }
.security-overview-copy { padding: 1.6rem 1.75rem; border-right: 1px solid #e2e8f0; }
.security-eyebrow { display: block; margin-bottom: .35rem; color: #059669; font-size: .7rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.security-overview h2, .security-panel h3 { margin: 0; color: #0f172a; font-weight: 750; }
.security-overview h2 { font-size: 1.25rem; }
.security-overview p, .security-panel-header p, .security-empty p { margin: .4rem 0 0; color: #64748b; font-size: .84rem; line-height: 1.55; }
.security-metrics { display: grid; grid-template-columns: repeat(3, 1fr); }
.security-metric { display: flex; align-items: center; gap: .75rem; min-width: 0; padding: 1.25rem; border-right: 1px solid #e2e8f0; }
.security-metric:last-child { border-right: 0; }
.security-metric-icon { width: .65rem; height: .65rem; flex: 0 0 auto; border: 3px solid #a7f3d0; border-radius: 999px; background: #10b981; box-shadow: 0 0 0 4px #ecfdf5; }
.security-metric-danger .security-metric-icon { border-color: #fecaca; background: #ef4444; box-shadow: 0 0 0 4px #fef2f2; }
.security-metric div { display: grid; min-width: 0; }
.security-metric strong { color: #0f172a; font-size: 1.45rem; line-height: 1.1; }
.security-metric span:last-child { margin-top: .25rem; overflow: hidden; color: #64748b; font-size: .72rem; font-weight: 650; text-overflow: ellipsis; white-space: nowrap; }
.security-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.15rem 1.35rem; border-bottom: 1px solid #e2e8f0; }
.security-panel h3 { font-size: 1rem; }
.security-panel-header p { margin-top: .2rem; }
.security-live { display: inline-flex; align-items: center; gap: .45rem; padding: .35rem .65rem; border: 1px solid #d1fae5; border-radius: 999px; background: #ecfdf5; color: #047857; font-size: .69rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.security-live i { width: .45rem; height: .45rem; border-radius: 50%; background: #10b981; box-shadow: 0 0 0 3px rgb(16 185 129 / .15); }
.security-table-wrap { width: 100%; overflow-x: auto; }
.security-table { width: 100%; min-width: 1120px; border-collapse: separate; border-spacing: 0; color: #334155; font-size: .79rem; }
.security-table th { padding: .72rem .9rem; border-right: 1px solid #e2e8f0; border-bottom: 1px solid #cbd5e1; background: #f8fafc; color: #475569; font-size: .66rem; font-weight: 800; letter-spacing: .055em; text-align: left; text-transform: uppercase; white-space: nowrap; }
.security-table th:last-child, .security-table td:last-child { border-right: 0; }
.security-table td { height: 4.35rem; padding: .75rem .9rem; border-right: 1px solid #e2e8f0; border-bottom: 1px solid #e2e8f0; vertical-align: middle; }
.security-table tbody tr:last-child td { border-bottom: 0; }
.security-table tbody tr:hover td { background: #f8fafc; }
.security-table tbody tr.is-blocked td:first-child { box-shadow: inset 3px 0 0 #ef4444; }
.security-ip { display: flex; align-items: center; gap: .55rem; }
.security-ip-icon { display: grid; place-items: center; width: 1.8rem; height: 1.8rem; flex: 0 0 auto; border: 1px solid #cbd5e1; border-radius: .42rem; background: #f8fafc; color: #64748b; font-size: .58rem; font-weight: 850; }
.security-ip code { color: #0f172a; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .78rem; font-weight: 650; white-space: nowrap; }
.security-badge { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .55rem; border: 1px solid; border-radius: 999px; font-size: .68rem; font-weight: 750; white-space: nowrap; }
.security-badge i { width: .38rem; height: .38rem; border-radius: 50%; }
.security-badge-blocked { border-color: #fecaca; background: #fef2f2; color: #b91c1c; }
.security-badge-blocked i { background: #ef4444; }
.security-badge-watch { border-color: #fde68a; background: #fffbeb; color: #a16207; }
.security-badge-watch i { background: #f59e0b; }
.security-attempts { display: grid; gap: .38rem; min-width: 5rem; }
.security-attempts div { display: flex; align-items: baseline; gap: .2rem; }
.security-attempts strong { color: #0f172a; font-size: .9rem; }
.security-attempts span { color: #94a3b8; font-size: .7rem; }
.security-progress { display: block; width: 4.8rem; height: .25rem; overflow: hidden; border-radius: 999px; background: #e2e8f0; }
.security-progress i { display: block; height: 100%; border-radius: inherit; background: #f59e0b; }
.is-blocked .security-progress i { background: #ef4444; }
.security-date { color: #475569; font-variant-numeric: tabular-nums; white-space: nowrap; }
.security-date.is-emphasis { color: #b91c1c; font-weight: 700; }
.security-actions-heading, .security-action-cell { text-align: right !important; }
.security-unblock { display: inline-flex; align-items: center; justify-content: center; gap: .4rem; min-height: 2rem; padding: .4rem .7rem; border: 1px solid #fecaca; border-radius: .45rem; background: #fff; color: #dc2626; font-size: .7rem; font-weight: 750; cursor: pointer; transition: background .15s, border-color .15s; }
.security-unblock:hover { border-color: #fca5a5; background: #fef2f2; }
.security-unblock:disabled { opacity: .55; cursor: wait; }
.security-unblock svg { width: .9rem; height: .9rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.security-no-action { color: #94a3b8; font-size: .72rem; }
.security-panel-footer { display: flex; align-items: center; gap: .4rem; padding: .7rem 1.35rem; border-top: 1px solid #e2e8f0; background: #f8fafc; color: #64748b; font-size: .7rem; }
.security-refresh-icon { color: #059669; font-size: .95rem; }
.security-empty { display: grid; justify-items: center; padding: 3.5rem 1rem; text-align: center; }
.security-empty-icon { display: grid; place-items: center; width: 3rem; height: 3rem; margin-bottom: .8rem; border-radius: 50%; background: #ecfdf5; color: #059669; font-size: 1.25rem; font-weight: 800; }
.security-empty strong { color: #0f172a; }
.dark .security-overview, .dark .security-panel { border-color: #3f3f46; background: #18181b; }
.dark .security-overview-copy, .dark .security-metric, .dark .security-panel-header, .dark .security-table th, .dark .security-table td, .dark .security-panel-footer { border-color: #3f3f46; }
.dark .security-overview h2, .dark .security-panel h3, .dark .security-metric strong, .dark .security-ip code, .dark .security-attempts strong, .dark .security-empty strong { color: #fafafa; }
.dark .security-table th, .dark .security-panel-footer { background: #27272a; color: #a1a1aa; }
.dark .security-table { color: #d4d4d8; }
.dark .security-table tbody tr:hover td, .dark .security-ip-icon { background: #27272a; }
.dark .security-ip-icon { border-color: #52525b; }
.dark .security-date { color: #d4d4d8; }
.dark .security-date.is-emphasis { color: #fca5a5; }
.dark .security-unblock { border-color: #7f1d1d; background: transparent; color: #fca5a5; }
.dark .security-unblock:hover { background: rgb(127 29 29 / .25); }
@media (max-width: 980px) { .security-overview { grid-template-columns: 1fr; } .security-overview-copy { border-right: 0; border-bottom: 1px solid #e2e8f0; } }
@media (max-width: 640px) { .security-metrics { grid-template-columns: 1fr; } .security-metric { border-right: 0; border-bottom: 1px solid #e2e8f0; } .security-metric:last-child { border-bottom: 0; } .security-panel-header { align-items: flex-start; } }
.security-user { display: block; max-width: 15rem; color: #334155; font-weight: 650; line-height: 1.4; overflow-wrap: anywhere; }
.dark .security-user { color: #e4e4e7; }

/* Workspace selector: two generous cards per row, growing with authorized panels. */
/* The selector keeps the login colors without its background illustration. */
.biodesk-panel-selector .fi-simple-main-ctn { padding: 5rem 2rem 3rem; }
.biodesk-panel-selector .fi-simple-main { width: 100%; max-width: 56rem; margin: 0; padding: 0; background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.biodesk-panel-selector .fi-page-header-main-ctn, .biodesk-panel-selector .fi-page-content { gap: 0; padding: 0; }
.panel-choice { width: 100%; margin: 0 auto; }
.panel-brand { display: flex; justify-content: center; margin-bottom: 2rem; }
.panel-surface { padding: 1.75rem; border: 1px solid #dce6e4; border-radius: 1.75rem; background: #fff; box-shadow: 0 20px 65px #063f4933; }
/* Clip transparent margins without altering the accepted logo. */
.panel-brand-crop { position: relative; display: block; width: 13rem; max-width: 100%; aspect-ratio: 1702 / 325; overflow: hidden; }
.panel-brand-logo { position: absolute; display: block; width: 122.3854%; max-width: none; height: auto; left: -12.3384%; top: -65.2308%; }
.biodesk-panel-selector .panel-brand img { filter: brightness(0) invert(1); }
.panel-welcome { margin-bottom: 2rem; }
.panel-welcome h1 { color: #29454e; font-size: clamp(1.65rem, 3vw, 2rem); font-weight: 650; letter-spacing: -.035em; line-height: 1.2; margin: 0 0 .65rem; }
.panel-intro { color: #677d85; font-size: 1rem; line-height: 1.6; margin: 0; }
.dark .panel-welcome h1 { color: #eff8f7; }
.dark .panel-intro { color: #b0c4ca; }
.panel-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
.panel-card { --card-accent: #167e78; --card-tint: #e5f5f1; display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #d8e4e2; border-radius: 1.15rem; background: #fff; color: #29454e; box-shadow: 0 3px 12px #213e4805; text-decoration: none; transition: transform .2s,box-shadow .2s,border-color .2s; }
.panel-card-visual { position: relative; width: 100%; aspect-ratio: 2 / 1; overflow: hidden; background: #edf6f3; border-bottom: 1px solid #dce8e5; }
.panel-card-image { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center; }
.panel-image-fallback { display: block; width: 4rem; height: 4rem; margin: 4rem auto; color: #167e78; }
.panel-card-body { display: flex; flex: 1; flex-direction: column; align-items: flex-start; width: 100%; padding: 1.25rem; }
.panel-card h2 { font-size: 1.2rem; line-height: 1.35; font-weight: 700; letter-spacing: -.025em; margin: 0 0 .65rem; }
.panel-card p { color: #677d85; font-size: .9rem; line-height: 1.5; font-weight: 400; margin: 0; }
.panel-link { display: flex; align-items: center; justify-content: space-between; gap: .6rem; width: 100%; padding-top: .75rem; border-top: 1px solid #edf1f3; color: var(--card-accent); font-size: .85rem; font-weight: 650; margin-top: auto; }
.panel-link svg { box-sizing: content-box; width: 1rem; height: 1rem; padding: .55rem; border-radius: 50%; background: var(--card-tint); flex-shrink: 0; transition: transform .2s; }
.panel-card:hover { transform: translateY(-5px); border-color: var(--card-accent); box-shadow: 0 20px 40px #23485120; }
.panel-card:hover .panel-link svg { transform: translateX(3px); }
.panel-card:focus-visible { outline: 3px solid var(--card-accent); outline-offset: 5px; }
.panel-status { margin-top: auto; font-size: .8rem; padding: .4rem .75rem; border-radius: 2rem; color: #4b5563; background: #f3f4f6; }
.dark .panel-brand-crop { background: transparent; }
.dark .panel-surface { background: #1b2b30; border-color: #33494f; }
.dark .panel-card { background: #213339; border-color: #33494f; color: #eff8f7; }
.dark .panel-card p { color: #b0c4ca; }
.dark .panel-link { color: #c3e5df; border-color: #354b51; }
.dark .panel-link svg { color: var(--card-accent); }
.dark .panel-status { background: #27272a; color: #d4d4d8; }
@media (max-width: 639px) {
    .biodesk-panel-selector .fi-simple-main-ctn { padding: 4.5rem 1.25rem 2rem; }
    .panel-grid { grid-template-columns: 1fr; gap: 1rem; }
    .panel-brand { margin-bottom: 1.5rem; }
    .panel-welcome { margin-bottom: 1.5rem; }
    .panel-surface { padding: 1.1rem; border-radius: 1.25rem; }
    .panel-card-body { padding: 1.25rem; }
    .panel-card h2 { font-size: 1.25rem; }
    .biodesk-panel-selector .fi-simple-main-ctn { padding-inline: .85rem; }
}
@media (prefers-reduced-motion: reduce) { .panel-card,.panel-link svg,.panel-card-image { transition: none; } .panel-card:hover,.panel-card:hover .panel-link svg,.panel-card:hover .panel-card-image { transform: none; } }


.cc-console { display: grid; gap: 1.4rem; }
.cc-intro { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.cc-intro h2 { font-size: 1.5rem; font-weight: 700; }
.cc-intro p, .cc-section > p, .cc-form > p, .cc-footnote { color: #6b7280; line-height: 1.6; }
.cc-metrics { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1rem; }
.cc-metrics section, .cc-section { background: white; border: 1px solid #e5e7eb; border-radius: .9rem; padding: 1.35rem; }
.cc-metrics span { display: block; color: #6b7280; font-size: .85rem; margin-bottom: .6rem; }
.cc-metrics strong { font-size: 1.05rem; }
.cc-section h2 { font-size: 1.12rem; font-weight: 700; margin-bottom: .7rem; }
.cc-section > p { margin-bottom: 1rem; }
.cc-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .65rem; }
.cc-button { padding: .6rem 1rem; border-radius: .55rem; background: #047857; color: white; font-weight: 600; cursor: pointer; }
.cc-button.secondary { background: #ecfdf5; color: #065f46; border: 1px solid #a7f3d0; }
.cc-button.danger { background: #fef2f2; color: #b91c1c; border: 1px solid #fecaca; }
.cc-button:disabled { opacity: .45; cursor: not-allowed; }
.cc-button:focus-visible { outline: 3px solid #34d399; outline-offset: 3px; }
.cc-notice { padding: 1rem; background: #fffbeb; border: 1px solid #fde68a; color: #92400e; border-radius: .7rem; }
.cc-table-wrap { overflow-x: auto; }
.cc-table { width: 100%; border-collapse: collapse; font-size: .9rem; text-align: left; }
.cc-table th, .cc-table td { padding: .7rem; border-bottom: 1px solid #e5e7eb; }
.cc-table th { color: #6b7280; font-weight: 600; }
.cc-form { display: grid; gap: 1.2rem; }
.cc-form label { display: grid; gap: .5rem; font-weight: 600; }
.cc-form input:not([type=checkbox]), .cc-form select, .cc-form textarea, .cc-actions input { width: 100%; border: 1px solid #d1d5db; border-radius: .55rem; background: white; padding: .65rem; font-weight: 400; }
.cc-actions input { width: 10rem; }
.cc-fields { display: grid; grid-template-columns: 1fr 2fr; gap: 1rem; }
.cc-form select { color: inherit; font-family: inherit; font-size: inherit; line-height: 1.5rem; padding-right: 2rem; }
.cc-form small { font-weight: 400; color: #6b7280; }
.cc-form .cc-checkbox { display: flex; align-items: center; gap: .65rem; }
.cc-error { color: #b91c1c; font-size: .85rem; }
.cc-events { margin-top: 1rem; display: grid; gap: .5rem; font-size: .85rem; }
.cc-footnote a { color: #047857; font-weight: 600; }
.dark .cc-metrics section, .dark .cc-section { background: #18181b; border-color: #3f3f46; }
.dark .cc-intro p, .dark .cc-section > p, .dark .cc-form > p, .dark .cc-footnote, .dark .cc-metrics span, .dark .cc-table th, .dark .cc-form small { color: #a1a1aa; }
.dark .cc-form input:not([type=checkbox]), .dark .cc-form select, .dark .cc-form textarea, .dark .cc-actions input { background: #27272a; border-color: #52525b; }
.dark .cc-table th, .dark .cc-table td { border-color: #3f3f46; }
.dark .cc-button.secondary { background: #064e3b; color: #a7f3d0; border-color: #047857; }
.dark .cc-notice { background: #422006; border-color: #854d0e; color: #fde68a; }
.dark .cc-footnote a { color: #34d399; }
@media(max-width:900px) { .cc-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); } .cc-fields { grid-template-columns: 1fr; } }
@media(max-width:560px) { .cc-intro { flex-direction: column; align-items: flex-start; } .cc-metrics { grid-template-columns: 1fr; } }
.cc-transcript { display: grid; gap: .85rem; max-height: 36rem; overflow-y: auto; padding: 1rem; background: #f9fafb; border-radius: .75rem; }
.cc-transcript h3 { font-weight: 700; font-size: 1rem; }
.cc-transcript-note { color: #6b7280; font-size: .8rem; }
.cc-transcript-turn { padding: .85rem 1rem; border: 1px solid #e5e7eb; border-radius: .75rem; background: white; width: min(90%, 56rem); }
.cc-transcript-turn > div { display: flex; justify-content: space-between; gap: 1rem; margin-bottom: .35rem; }
.cc-transcript-turn time { color: #6b7280; font-size: .8rem; }
.cc-transcript-turn p { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.65; }
.cc-transcript-agent { margin-left: auto; background: #ecfdf5; border-color: #a7f3d0; }
.dark .cc-transcript { background: #09090b; }
.dark .cc-transcript-turn { background: #27272a; border-color: #3f3f46; }
.dark .cc-transcript-agent { background: #052e24; border-color: #065f46; }
.dark .cc-transcript-note, .dark .cc-transcript-turn time { color: #a1a1aa; }
.cc-history-row { cursor: pointer; transition: background-color .15s ease; }
.cc-history-row:hover, .cc-history-row.is-expanded { background: #f0fdf9; }
.cc-history-origin { display: flex; align-items: center; gap: .35rem; }
.cc-history-origin .cc-history-toggle { flex-shrink: 0; margin-left: -.5rem; }
.cc-history-toggle { display: inline-flex; align-items: center; justify-content: center; width: 2.25rem; height: 2.25rem; padding: .5rem; border-radius: .5rem; color: #6b7280; background: transparent; cursor: pointer; }
.cc-history-toggle svg { width: 1rem; height: 1rem; transition: transform .18s ease; }
.cc-history-toggle[aria-expanded="true"] svg { transform: rotate(90deg); }
.cc-history-row:hover .cc-history-toggle, .cc-history-row.is-expanded .cc-history-toggle { color: #047857; }
.cc-history-toggle:focus-visible { outline: 2px solid #059669; outline-offset: 2px; }
.cc-history-busy { pointer-events: none; opacity: .6; }
.dark .cc-history-row:hover, .dark .cc-history-row.is-expanded { background: rgb(6 78 59 / .2); }
.dark .cc-history-toggle { color: #a1a1aa; }
.dark .cc-history-row:hover .cc-history-toggle, .dark .cc-history-row.is-expanded .cc-history-toggle { color: #34d399; }
@media (prefers-reduced-motion: reduce) { .cc-history-row, .cc-history-toggle svg { transition: none; } }
.cc-sentiment { display: inline-flex; align-items: center; gap: .45rem; padding: .3rem .65rem; border-radius: 2rem; white-space: nowrap; font-size: .82rem; font-weight: 600; }
.cc-sentiment-face { font-size: 1.3rem; line-height: 1.2; }
.cc-sentiment-positive { background: #ecfdf5; color: #065f46; }
.cc-sentiment-neutral { background: #f3f4f6; color: #4b5563; }
.cc-sentiment-uncertain { background: #fffbeb; color: #92400e; }
.cc-sentiment-negative { background: #fef2f2; color: #991b1b; }
.cc-sentiment-summary { display: grid; justify-items: start; gap: .5rem; padding-bottom: .75rem; border-bottom: 1px solid #e5e7eb; }
.cc-sentiment-summary small { color: #6b7280; }
.dark .cc-sentiment-positive { background: #052e24; color: #6ee7b7; }
.dark .cc-sentiment-neutral { background: #27272a; color: #d4d4d8; }
.dark .cc-sentiment-uncertain { background: #422006; color: #fcd34d; }
.dark .cc-sentiment-negative { background: #450a0a; color: #fca5a5; }
.dark .cc-sentiment-summary { border-color: #3f3f46; }
.dark .cc-sentiment-summary small { color: #a1a1aa; }
.cc-branch-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.5rem; align-items:start; }
.cc-branch-unassigned { grid-column:1/-1; }
.cc-branch { min-width:0; transition:border-color .15s,box-shadow .15s; }
.cc-branch.cc-drop-active { border-color:#059669; box-shadow:0 0 0 3px #10b98133; }
.cc-branch-heading { display:flex; align-items:center; gap:.65rem; margin-bottom:1rem; }
.cc-branch-heading > svg { width:1.3rem; height:1.3rem; color:#059669; flex-shrink:0; }
.cc-branch-heading .cc-edit-hint { color:#9ca3af; width:1rem; }
.cc-branch-name, .cc-extension-name { min-width:0; width:100%; background:transparent; border:1px solid transparent; border-radius:.4rem; padding:.4rem; color:inherit; }
.cc-branch-name { font-weight:700; font-size:1rem; }
.cc-branch-name:hover, .cc-extension-name:hover { border-color:#d1d5db; }
.cc-branch-name:focus, .cc-extension-name:focus { outline:2px solid #059669; outline-offset:1px; }
.cc-branch-count { margin-left:auto; border-radius:1rem; padding:.2rem .6rem; background:#ecfdf5; color:#047857; font-size:.8rem; }
.cc-extension-number { display:flex; align-items:center; gap:.45rem; }
.cc-drag-handle { cursor:grab; color:#9ca3af; padding:.3rem; }
.cc-drag-handle:active { cursor:grabbing; }
.cc-drag-handle svg, .cc-move-button svg { width:1rem; height:1rem; }
.cc-extension-edit { display:flex; align-items:center; gap:.3rem; flex-wrap:wrap; }
.cc-extension-name { flex:1; width:8rem; }
.cc-move-button { padding:.5rem; color:#6b7280; border-radius:.4rem; }
.cc-move-button:hover { background:#ecfdf5; color:#047857; }
.cc-extension-destination { width:100%; padding:.4rem; border:1px solid #d1d5db; border-radius:.4rem; background:transparent; }
.cc-presence { display:inline-block; width:.7rem; height:.7rem; border-radius:50%; flex-shrink:0; vertical-align:middle; }
.cc-presence.free { background:#16a34a; box-shadow:0 0 0 3px #16a34a18; }
.cc-presence.busy { background:#dc2626; box-shadow:0 0 0 3px #dc262618; }
.cc-presence.unknown { background:#9ca3af; }
.cc-presence-legend { display:flex; align-items:center; flex-wrap:wrap; gap:1.25rem; font-size:.85rem; color:#6b7280; }
.cc-presence-legend span { display:flex; gap:.5rem; align-items:center; }
.cc-presence-legend small { margin-left:auto; }
.cc-extension-table th:last-child, .cc-extension-table td:last-child { text-align:center; width:5rem; }
.cc-extension-table th:first-child { width:8rem; }
.cc-drop-empty { text-align:center; color:#9ca3af; padding:2rem 1rem !important; }
.dark .cc-branch-count { background:#064e3b; color:#a7f3d0; }
.dark .cc-presence-legend { color:#a1a1aa; }
@media(max-width:900px) { .cc-branch-grid { grid-template-columns:1fr; } }
.cc-branch-column { display:flex; flex-direction:column; gap:1.5rem; min-width:0; min-height:5rem; }
.cc-branch-column > .cc-branch { margin:0; }
.cc-column-dragging { min-height:10rem; }
.cc-branch-drop-slot { border:2px dashed #a7f3d0; border-radius:.75rem; color:#047857; padding:1.5rem; text-align:center; font-size:.85rem; }
.cc-branch-grip { padding:.4rem; border-radius:.4rem; }
.cc-branch-grip svg { width:1.2rem; height:1.2rem; }
.cc-branch-grip:hover { background:#ecfdf5; color:#047857; }
.cc-layout-controls { display:flex; align-items:center; flex-shrink:0; }
.dark .cc-branch-drop-slot { border-color:#065f46; color:#6ee7b7; }
.cc-trunk-state { display:flex; align-items:center; gap:.7rem; }
.cc-trunk-state small { display:block; font-size:.8rem; color:#6b7280; margin-top:.2rem; }
.cc-pending-extensions { border:1px dashed #d1d5db; padding:1rem; border-radius:.75rem; }
.cc-pending-extensions summary { cursor:pointer; color:#047857; font-weight:600; }
.cc-pending-list { display:flex; gap:1rem; flex-wrap:wrap; padding-top:1rem; }
.cc-pending-list label { display:flex; gap:.7rem; align-items:center; }
.cc-pending-list select { border:1px solid #d1d5db; border-radius:.4rem; padding:.4rem; background:transparent; }
.dark .cc-trunk-state small { color:#a1a1aa; }
.cc-cdr-filters { display:flex; align-items:end; gap:1rem; flex-wrap:wrap; }
.cc-cdr-filters label { display:grid; gap:.4rem; font-size:.9rem; font-weight:600; }
.cc-cdr-filters input, .cc-cdr-filters select { border:1px solid #d1d5db; border-radius:.5rem; padding:.55rem .7rem; background:transparent; color:inherit; }
.cc-cdr-audio { min-width:10rem; }
.cc-cdr-audio button { display:inline-flex; align-items:center; gap:.4rem; white-space:nowrap; }
.cc-cdr-audio button svg { width:1rem; height:1rem; }
.cc-cdr-audio audio { width:17rem; height:2.5rem; }
.cc-cdr-audio small { display:block; color:#b91c1c; max-width:17rem; }
.cc-call-detail { display:block; margin-top:.25rem; font-size:.8rem; color:#6b7280; }
.dark .cc-call-detail { color:#a1a1aa; }

.cc-call-status { display:inline-flex; align-items:center; justify-content:center; width:8.5rem; height:2.25rem; padding:.35rem .6rem; border:1px solid transparent; border-radius:.5rem; text-align:center; white-space:nowrap; font-size:.85rem; font-weight:600; line-height:1.2; }
.cc-call-status-answered { background:#ecfdf5; color:#047857; border-color:#a7f3d0; }
.cc-call-status-unanswered { background:#fff7ed; color:#c2410c; border-color:#fed7aa; }
.cc-call-status-other { background:#f3f4f6; color:#4b5563; border-color:#e5e7eb; }
.dark .cc-call-status-answered { background:#064e3b; color:#a7f3d0; border-color:#047857; }
.dark .cc-call-status-unanswered { background:#431407; color:#fdba74; border-color:#9a3412; }
.dark .cc-call-status-other { background:#27272a; color:#d4d4d8; border-color:#52525b; }

.cc-call-detail.cc-call-answered-by { color:#047857; font-weight:700; }
.dark .cc-call-detail.cc-call-answered-by { color:#6ee7b7; }

.cc-origin-location { cursor: help; text-decoration: underline dotted; text-underline-offset: 4px; text-decoration-color: #94a3b8; }

.cc-history-sort { display: inline-flex; align-items: center; gap: .45rem; cursor: pointer; font: inherit; color: inherit; background: transparent; border: 0; padding: .25rem 0; white-space: nowrap; }
.cc-history-sort span { font-size: .75rem; opacity: .7; }
.cc-history-sort.is-active, .cc-history-sort:hover { color: #008f78; }
.cc-history-sort:focus-visible { outline: 2px solid #00c99a; outline-offset: 4px; border-radius: 3px; }
.cc-history-sort:disabled { cursor: wait; opacity: .6; }
.dark .cc-history-sort.is-active, .dark .cc-history-sort:hover { color: #34d399; }

.cc-history-results-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; }
.cc-history-search { display: flex; align-items: center; gap: .65rem; font-size: .875rem; font-weight: 600; }
.cc-history-search input { width: 17rem; max-width: 100%; border: 1px solid #d1d5db; border-radius: .5rem; padding: .55rem .7rem; background: transparent; color: inherit; font-weight: 400; }
.dark .cc-history-search input { border-color: #4b5563; }
@media (max-width: 640px) { .cc-history-search { width: 100%; } .cc-history-search input { flex: 1; min-width: 0; } }

.cc-directory-tabs { display: flex; gap: .5rem; border-bottom: 1px solid #e2e8f0; padding-bottom: .7rem; }
.cc-directory-tabs button { padding: .6rem 1rem; border-radius: .5rem; color: #64748b; font-weight: 600; cursor: pointer; }
.cc-directory-tabs button.is-active { color: #008f78; background: #ecfdf5; }
.cc-directory-fields { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1rem; }
.cc-directory-fields input, .cc-directory-fields select { width: 100%; }
.cc-directory-coverage { border: 1px solid #d1d5db; border-radius: .75rem; padding: 1rem; }
.cc-directory-coverage legend { font-weight: 600; padding: 0 .5rem; }
.cc-directory-coverage > div { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: .5rem; }
.cc-directory-coverage label { display: flex; flex-direction: row; align-items: center; gap: .5rem; font-weight: 400; }
.cc-directory-coverage input[type=checkbox] { width: 1rem; height: 1rem; }
.cc-directory-filters { margin: 1rem 0; }
.cc-directory-wrap { max-width: 25rem; white-space: normal; }
.dark .cc-directory-tabs, .dark .cc-directory-coverage { border-color: #374151; }
.dark .cc-directory-tabs button.is-active { color: #6ee7b7; background: #064e3b; }

.cc-interlocutor { display: inline-flex; align-items: center; padding: .35rem .65rem; border-radius: .5rem; background: #ecfdf5; color: #047857; font-size: .8rem; font-weight: 600; white-space: nowrap; }
.cc-interlocutor.is-unknown { background: #f3f4f6; color: #6b7280; }
.dark .cc-interlocutor { background: #064e3b; color: #a7f3d0; }
.dark .cc-interlocutor.is-unknown { background: #374151; color: #d1d5db; }

/* Contacto web */
.cc-web-toolbar { display:flex; flex-wrap:wrap; align-items:end; gap:1rem; margin-bottom:1.5rem; }
.cc-web-toolbar label { display:grid; gap:.4rem; font-size:.875rem; font-weight:600; }
.cc-web-toolbar input, .cc-web-toolbar select { box-sizing:border-box; height:2.75rem; }
.cc-web-toolbar select { min-width:14rem; max-width:100%; }
.cc-web-search { flex:1; min-width:240px; }
.cc-web-table td { max-width:280px; overflow-wrap:anywhere; }
.cc-web-date { white-space:nowrap; }
.cc-web-detail { padding:1rem; background:#f9fafb; border-radius:.75rem; }
.cc-web-detail dl { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:1rem; }
.cc-web-detail dt { font-size:.8rem; color:#6b7280; margin-bottom:.25rem; }
.cc-web-detail dd { overflow-wrap:anywhere; }
.cc-web-message { margin-top:1.25rem; border-top:1px solid #e5e7eb; padding-top:1rem; }
.cc-web-message h3 { font-weight:600; margin-bottom:.5rem; }
.cc-web-message p { white-space:pre-wrap; overflow-wrap:anywhere; }
.dark .cc-web-detail { background:#18181b; }
.dark .cc-web-detail dt { color:#a1a1aa; }
.dark .cc-web-message { border-color:#3f3f46; }

/* Plantillas de correo */
.cc-mail-cards { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:1rem; }
.cc-mail-card { border:1px solid #dce7e4; background:white; border-radius:12px; overflow:hidden; text-align:left; cursor:pointer; padding:0 20px 20px; }
.cc-mail-card.is-selected { border-color:#00a896; box-shadow:0 0 0 2px #00a896; }
.cc-mail-card-logo { display:block; border-top:6px solid #00a896; margin:0 -20px 18px; padding:18px 20px; background:#f1f9f6; }
.cc-mail-card-logo img { width:140px; height:auto; }
.cc-mail-card strong { display:block; margin-bottom:7px; }
.cc-mail-card > span:last-child { font-size:.85rem; color:#6b7280; line-height:1.6; }
.cc-mail-workspace { display:grid; grid-template-columns:minmax(300px, .8fr) minmax(0,1.2fr); gap:1.4rem; align-items:start; }
.cc-mail-preview { position:sticky; top:90px; min-width:0; }
.cc-mail-preview-canvas { background:#eaf0ed; border-radius:10px; overflow:hidden; margin-top:16px; }
.cc-mail-preview iframe { display:block; border:0; width:100%; height:820px; margin:auto; background:white; }
.cc-mail-preview iframe.is-mobile { max-width:375px; }
.cc-mail-variables { font-size:.8rem; line-height:1.8; }
.cc-mail-variables code { display:inline-block; background:#ecf8f4; color:#087d6c; border-radius:4px; padding:2px 5px; margin:3px 0; }
.dark .cc-mail-card { background:#18181b; border-color:#3f3f46; }
.dark .cc-mail-card.is-selected { border-color:#00a896; }
.dark .cc-mail-card > span:last-child { color:#a1a1aa; }
@media(max-width:1100px) { .cc-mail-workspace { grid-template-columns:1fr; } .cc-mail-preview { position:static; } }

/* Control panel: login history. Explicit styles work without a Tailwind rebuild. */
.cp-login-meta { display:flex; justify-content:flex-end; color:#6b7280; font-size:.8125rem; }
.cp-login-meta strong { font-weight:500; }
.cp-login-filters { display:grid; grid-template-columns:minmax(240px,2fr) repeat(2,minmax(160px,1fr)); gap:20px; padding:20px 24px; background:#fff; border:1px solid #e5e7eb; border-radius:12px; box-shadow:0 1px 2px #00000005; }
.cp-login-field { display:flex; flex-direction:column; gap:8px; min-width:0; font-size:.875rem; font-weight:500; }
.cp-login-field input,.cp-login-field select { min-height:40px; }
.cp-login-card { min-width:0; overflow:hidden; background:#fff; border:1px solid #e5e7eb; border-radius:12px; box-shadow:0 1px 2px #00000005; }
.cp-login-scroll { overflow-x:auto; }
.cp-login-table { width:100%; min-width:760px; border-collapse:collapse; text-align:left; font-size:.875rem; }
.cp-login-table th { padding:15px 24px; background:#f9fafb; color:#374151; font-weight:600; white-space:nowrap; border-bottom:1px solid #e5e7eb; }
.cp-login-table td { padding:18px 24px; vertical-align:middle; border-bottom:1px solid #f0f1f3; }
.cp-login-table tbody tr:last-child td { border-bottom:0; }
.cp-login-table tbody tr:hover { background:#fafcfb; }
.cp-login-table th:first-child { width:38%; }
.cp-login-name { display:block; font-weight:500; line-height:1.5; }
.cp-login-email { display:block; margin-top:3px; color:#6b7280; font-size:.8125rem; overflow-wrap:anywhere; }
.cp-login-date { white-space:nowrap; font-variant-numeric:tabular-nums; }
.cp-login-ip { font-variant-numeric:tabular-nums; overflow-wrap:anywhere; min-width:150px; }
.cp-login-type { display:inline-block; border-radius:6px; padding:4px 9px; background:#ecfdf5; color:#047857; font-size:.75rem; font-weight:500; white-space:nowrap; }
.cp-login-table .cp-login-empty { padding:44px 24px; text-align:center; color:#6b7280; }
.cp-login-pagination { padding:16px 24px; border-top:1px solid #e5e7eb; }
.dark .cp-login-filters,.dark .cp-login-card { background:#18181b; border-color:#3f3f46; }
.dark .cp-login-table th { background:#27272a; color:#e4e4e7; border-color:#3f3f46; }
.dark .cp-login-table td,.dark .cp-login-pagination { border-color:#3f3f46; }
.dark .cp-login-table tbody tr:hover { background:#27272a; }
.dark .cp-login-meta,.dark .cp-login-email,.dark .cp-login-table .cp-login-empty { color:#a1a1aa; }
.dark .cp-login-type { background:#064e3b; color:#a7f3d0; }
@media(max-width:800px) {
    .cp-login-filters { grid-template-columns:repeat(2,minmax(0,1fr)); padding:16px; gap:16px; }
    .cp-login-field:first-child { grid-column:1 / -1; }
    .cp-login-meta { justify-content:flex-start; }
    .cp-login-table th,.cp-login-table td { padding:14px 16px; }
}
@media(max-width:480px) { .cp-login-filters { grid-template-columns:minmax(0,1fr); } }


/* Modern BioDesk login. Scoped so authenticated portal screens are unchanged. */
[x-cloak] { display: none !important; }
.biodesk-login-page { --biodesk-teal: #1d958e; --biodesk-slate: #39515a; }
.biodesk-login-page .fi-simple-layout {
    min-height: 100vh;
    background:
        radial-gradient(circle at 15% 18%, rgb(29 149 142 / 13%), transparent 28rem),
        radial-gradient(circle at 88% 84%, rgb(57 81 90 / 12%), transparent 30rem),
        linear-gradient(145deg, #f7fbfb 0%, #f4f7f8 48%, #eef4f4 100%);
}
.biodesk-login-page .fi-simple-main-ctn { padding: 2rem 1rem; }
.biodesk-login-page .fi-simple-main { width: min(100%, 29rem); }
.biodesk-login-page .fi-simple-page-content {
    position: relative; overflow: hidden; padding: 2.25rem;
    border: 1px solid rgb(57 81 90 / 12%); border-radius: 1.35rem;
    background: rgb(255 255 255 / 94%); box-shadow: 0 1.5rem 4.5rem rgb(57 81 90 / 16%);
    backdrop-filter: blur(14px);
}
.biodesk-login-page .fi-simple-page-content::before {
    content: ''; position: absolute; inset: 0 0 auto; height: .3rem;
    background: linear-gradient(90deg, var(--biodesk-teal), #70c8c3 55%, var(--biodesk-slate));
}
.biodesk-login-page .fi-simple-header { gap: .45rem; margin-bottom: 1.6rem; }
.biodesk-login-page .fi-logo { height: 3.8rem; margin-bottom: .35rem; }
.biodesk-login-page .fi-simple-header-heading { color: var(--biodesk-slate); font-size: 1.65rem; letter-spacing: -.025em; }
.biodesk-login-page .fi-simple-header-subheading { color: #667c83; font-size: .9rem; }
.biodesk-login-intro { margin: -.35rem 0 1.15rem; text-align: center; color: #50636b; font-size: .92rem; }
.biodesk-login-options { display: grid; gap: 1rem; }
.biodesk-google-login,
.biodesk-password-toggle {
    display: flex; align-items: center; justify-content: center; width: 100%; min-height: 3.15rem;
    border-radius: .7rem; font-weight: 700; transition: transform .15s, border-color .15s, box-shadow .15s, background .15s;
}
.biodesk-google-login {
    position: relative; border: 1px solid #d7dee0; background: #fff; color: #263b43;
    box-shadow: 0 .3rem 1rem rgb(57 81 90 / 9%);
}
.biodesk-google-login img { position: absolute; left: 1.05rem; width: 1.25rem; height: 1.25rem; }
.biodesk-google-login:hover { transform: translateY(-1px); background: #fbfdfd; border-color: #8fc9c5; box-shadow: 0 .55rem 1.3rem rgb(29 149 142 / 14%); }
.biodesk-google-login:focus-visible,
.biodesk-password-toggle:focus-visible { outline: 3px solid rgb(29 149 142 / 22%); outline-offset: 2px; }
.biodesk-login-separator { display: flex; align-items: center; gap: .75rem; color: #849398; font-size: .78rem; }
.biodesk-login-separator::before,
.biodesk-login-separator::after { content: ''; height: 1px; flex: 1; background: #e1e7e8; }
.biodesk-password-toggle { min-height: 2.8rem; border: 1px solid #cbd5d8; background: #f8fafa; color: var(--biodesk-slate); }
.biodesk-password-toggle:hover { transform: translateY(-1px); border-color: var(--biodesk-teal); color: #14766f; background: #f4fbfa; }
.biodesk-password-form { padding-top: .35rem; }
.biodesk-password-form .fi-btn { background: var(--biodesk-teal); }
.biodesk-password-form .fi-btn:hover { background: #177f79; }
.dark .biodesk-login-page .fi-simple-layout { background: linear-gradient(145deg, #172126, #1f2d32); }
.dark .biodesk-login-page .fi-simple-page-content { border-color: rgb(168 213 213 / 20%); background: rgb(31 41 45 / 95%); }
.dark .biodesk-login-page .fi-simple-header-heading { color: #f4fafa; }
.dark .biodesk-login-page .fi-simple-header-subheading,
.dark .biodesk-login-intro { color: #a8c2c2; }
.dark .biodesk-google-login,
.dark .biodesk-password-toggle { border-color: #50636b; background: #26363c; color: #f4fafa; }
.dark .biodesk-login-separator::before,
.dark .biodesk-login-separator::after { background: #50636b; }
@media (max-width: 480px) {
    .biodesk-login-page .fi-simple-main-ctn { padding: 1rem .75rem; }
    .biodesk-login-page .fi-simple-page-content { padding: 1.65rem 1.25rem; border-radius: 1rem; }
}

/* BioDesk login inspired by the Portal Instituto split composition. */
.biodesk-login-page .fi-simple-layout {
    min-height: 100vh;
    background: #fff;
}
.biodesk-login-page .fi-simple-main-ctn {
    min-height: 100vh;
    padding: 0;
}
.biodesk-login-page .fi-simple-main {
    width: 100%;
    max-width: none;
}
.biodesk-login-page .fi-simple-header {
    display: none;
}
.biodesk-login-page .fi-simple-page-content {
    overflow: visible;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
}
.biodesk-login-page .fi-simple-page-content::before {
    display: none;
}
.biodesk-login-shell {
    display: grid;
    grid-template-columns: minmax(30rem, 1.04fr) minmax(29rem, .96fr);
    min-height: 100vh;
}
.biodesk-login-hero {
    position: relative;
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    padding: clamp(2.2rem, 4vw, 4.5rem);
    color: #fff;
    background:
        radial-gradient(circle at 80% 18%, rgb(140 221 214 / 18%), transparent 18rem),
        linear-gradient(145deg, #304a54 0%, #246b70 48%, #178f87 100%);
}
.biodesk-login-hero::before,
.biodesk-login-hero::after {
    content: '';
    position: absolute;
    pointer-events: none;
    border: 1px solid rgb(255 255 255 / 10%);
    border-radius: 50%;
}
.biodesk-login-hero::before {
    right: -13rem;
    bottom: -15rem;
    width: 34rem;
    height: 34rem;
    box-shadow: 0 0 0 5rem rgb(255 255 255 / 3%), 0 0 0 10rem rgb(255 255 255 / 2%);
}
.biodesk-login-hero::after {
    top: 18%;
    left: -8rem;
    width: 17rem;
    height: 17rem;
}
.biodesk-login-hero-logo {
    position: relative;
    z-index: 1;
    width: clamp(13rem, 21vw, 18rem);
    height: auto;
}
.biodesk-login-hero-copy {
    position: relative;
    z-index: 1;
    width: min(100%, 36rem);
    margin: auto 0;
    padding: 5rem 0;
}
.biodesk-login-eyebrow {
    display: flex;
    align-items: center;
    gap: .75rem;
    color: #1d958e;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .2em;
}
.biodesk-login-hero .biodesk-login-eyebrow {
    color: #d8f4f1;
}
.biodesk-login-eyebrow::before {
    content: '';
    width: 1.8rem;
    height: 3px;
    border-radius: 2px;
    background: currentColor;
}
.biodesk-login-hero h1 {
    max-width: 34rem;
    margin: 1.5rem 0 1.25rem;
    color: #fff;
    font-size: clamp(2.5rem, 4.3vw, 4.7rem);
    font-weight: 650;
    line-height: 1.04;
    letter-spacing: -.055em;
}
.biodesk-login-hero-copy > p {
    max-width: 32rem;
    color: rgb(238 253 251 / 86%);
    font-size: clamp(.98rem, 1.25vw, 1.12rem);
    line-height: 1.8;
}
.biodesk-login-hero-footer {
    position: relative;
    z-index: 1;
    color: rgb(238 253 251 / 70%);
    font-size: .75rem;
}
.biodesk-login-access {
    display: grid;
    place-items: center;
    min-width: 0;
    padding: clamp(2rem, 6vw, 6rem);
    background:
        radial-gradient(circle at 100% 0%, rgb(29 149 142 / 8%), transparent 22rem),
        #fff;
}
.biodesk-login-card {
    width: min(100%, 27rem);
}
.biodesk-login-card-logo {
    display: block;
    width: 12rem;
    height: auto;
    margin-bottom: 3.5rem;
}
.biodesk-login-card h2 {
    margin: .8rem 0 .65rem;
    color: #203b45;
    font-size: clamp(2rem, 3vw, 2.65rem);
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -.045em;
}
.biodesk-login-card .biodesk-login-intro {
    margin: 0 0 2rem;
    text-align: left;
    color: #687b82;
    font-size: .92rem;
    line-height: 1.65;
}
.biodesk-login-options {
    gap: 1rem;
}
.biodesk-google-login {
    min-height: 3.5rem;
    border-color: #cbd8da;
    border-radius: .65rem;
    box-shadow: 0 .35rem 1.1rem rgb(57 81 90 / 8%);
}
.biodesk-google-login img {
    left: 1.15rem;
    width: 1.35rem;
    height: 1.35rem;
}
.biodesk-password-toggle {
    justify-content: space-between;
    min-height: 3.15rem;
    padding: 0 1rem;
    border: 0;
    border-radius: .65rem;
    background: transparent;
    color: #31515a;
}
.biodesk-password-toggle:hover {
    transform: none;
    border-color: transparent;
    background: #eef7f6;
}
.biodesk-password-toggle > span {
    color: #1d958e;
    font-size: 1.15rem;
}
.biodesk-login-separator {
    color: #8a999e;
}
.biodesk-password-form {
    padding-top: .25rem;
}
.biodesk-password-form-visible {
    margin-top: 2rem;
}
.biodesk-password-form .fi-btn {
    min-height: 3rem;
    border-radius: .65rem;
}
.biodesk-login-note {
    margin-top: 2.25rem;
    color: #89979b;
    font-size: .75rem;
    text-align: center;
}
.dark .biodesk-login-page .fi-simple-layout,
.dark .biodesk-login-access {
    background: #fff;
}
.dark .biodesk-login-card h2 {
    color: #203b45;
}
.dark .biodesk-login-card .biodesk-login-intro,
.dark .biodesk-login-note {
    color: #687b82;
}
.dark .biodesk-login-note {
    color: #89979b;
}
.dark .biodesk-login-separator::before,
.dark .biodesk-login-separator::after {
    background: #e1e7e8;
}
.dark .biodesk-google-login {
    border-color: #cbd8da;
    background: #fff;
    color: #263b43;
}
.dark .biodesk-password-toggle {
    background: transparent;
    color: #31515a;
}
@media (max-width: 900px) {
    .biodesk-login-shell {
        grid-template-columns: minmax(0, 1fr);
    }
    .biodesk-login-hero {
        min-height: 22rem;
        padding: 2rem;
    }
    .biodesk-login-hero-logo {
        width: 13rem;
    }
    .biodesk-login-hero-copy {
        padding: 3.5rem 0 2rem;
    }
    .biodesk-login-hero h1 {
        max-width: 31rem;
        margin-top: 1rem;
        font-size: clamp(2.2rem, 8vw, 3.5rem);
    }
    .biodesk-login-hero-copy > p {
        max-width: 36rem;
        line-height: 1.65;
    }
    .biodesk-login-access {
        min-height: 34rem;
        padding: 3.5rem 1.5rem 4rem;
    }
    .biodesk-login-card-logo {
        display: none;
    }
}
@media (max-width: 560px) {
    .biodesk-login-hero {
        min-height: 15rem;
        padding: 1.5rem;
    }
    .biodesk-login-hero-copy {
        padding: 2.5rem 0 0;
    }
    .biodesk-login-hero h1 {
        font-size: 2.25rem;
    }
    .biodesk-login-hero-copy > p,
    .biodesk-login-hero-footer {
        display: none;
    }
    .biodesk-login-access {
        place-items: start center;
        min-height: calc(100vh - 15rem);
        padding: 2.5rem 1.25rem 3rem;
    }
}


/* Login viewport fit and Pantone 3262 C refinement. */
.biodesk-login-page,
.biodesk-login-page body {
    margin: 0;
    overflow: hidden;
}
.biodesk-login-page .fi-simple-layout,
.biodesk-login-page .fi-simple-main-ctn,
.biodesk-login-page .fi-simple-main,
.biodesk-login-page .fi-simple-page,
.biodesk-login-page .fi-simple-page-content,
.biodesk-login-shell {
    width: 100%;
    height: 100%;
    min-height: 100dvh;
    margin: 0;
}
.biodesk-login-page .fi-simple-main-ctn {
    position: fixed;
    inset: 0;
    display: block;
    max-width: none;
}
.biodesk-login-page .fi-simple-main,
.biodesk-login-page .fi-simple-page,
.biodesk-login-page .fi-simple-page-content {
    max-width: none;
}
.biodesk-login-hero {
    background:
        radial-gradient(circle at 78% 16%, rgb(180 247 241 / 22%), transparent 19rem),
        linear-gradient(145deg, #226d72 0%, #078f8c 48%, #00b2a9 100%);
}
@media (max-width: 900px) {
    .biodesk-login-page,
    .biodesk-login-page body,
    .biodesk-login-page .fi-simple-layout {
        overflow: auto;
    }
    .biodesk-login-page .fi-simple-main-ctn {
        position: static;
        min-height: 100dvh;
    }
    .biodesk-login-page .fi-simple-main,
    .biodesk-login-page .fi-simple-page,
    .biodesk-login-page .fi-simple-page-content,
    .biodesk-login-shell {
        height: auto;
    }
}


/* Force the login canvas flush with every viewport edge. */
html:has(body.biodesk-login-page),
body.biodesk-login-page {
    width: 100%;
    height: 100%;
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
}
body.biodesk-login-page .fi-simple-layout,
body.biodesk-login-page .fi-simple-main-ctn,
body.biodesk-login-page .fi-simple-main,
body.biodesk-login-page .fi-simple-page,
body.biodesk-login-page .fi-simple-page-content {
    width: 100% !important;
    max-width: none !important;
    min-height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
}
body.biodesk-login-page .fi-simple-main-ctn {
    position: fixed !important;
    inset: 0 !important;
}
body.biodesk-login-page .biodesk-login-shell {
    width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    margin: 0 !important;
}
@media (max-width: 900px) {
    html:has(body.biodesk-login-page),
    body.biodesk-login-page {
        height: auto;
        overflow: auto !important;
    }
    body.biodesk-login-page .fi-simple-main-ctn {
        position: static !important;
    }
    body.biodesk-login-page .biodesk-login-shell {
        width: 100% !important;
        height: auto !important;
    }
}


/* Soft artwork from the supplied image, limited to the white login area. */
.biodesk-login-access {
    position: relative;
    isolation: isolate;
    overflow: hidden;
}
.biodesk-login-access::before {
    content: '';
    position: absolute;
    z-index: -2;
    inset: -1.5rem;
    background: url('/images/biodesk-login-background.webp') center / cover no-repeat;
    filter: blur(3px);
    opacity: .28;
    transform: scale(1.04);
}
.biodesk-login-access::after {
    content: '';
    position: absolute;
    z-index: -1;
    inset: 0;
    background: linear-gradient(90deg, rgb(255 255 255 / 78%), rgb(255 255 255 / 48%));
}
.biodesk-login-card {
    position: relative;
    z-index: 1;
}

/* Move the supplied artwork to the Pantone panel; keep the access area clean white. */
.biodesk-login-access {
    background: #fff;
}
.biodesk-login-access::before,
.biodesk-login-access::after {
    display: none;
}
.biodesk-login-hero {
    background:
        linear-gradient(145deg, rgb(27 104 108 / 92%) 0%, rgb(0 148 141 / 89%) 48%, rgb(0 178 169 / 86%) 100%),
        url('/images/biodesk-login-background.webp') center / cover no-repeat;
}

.biodesk-panel-selector .fi-simple-layout {
    background: linear-gradient(145deg, rgb(27 104 108 / 92%) 0%, rgb(0 148 141 / 89%) 48%, rgb(0 178 169 / 86%) 100%), #edf6f3;
}

/* The access panel is intentionally light, even when the browser requests dark mode. */
.biodesk-login-page .biodesk-login-access {
    color-scheme: light;
    color: #203b45;
}
.biodesk-login-page .biodesk-login-access label,
.biodesk-login-page .biodesk-login-access .fi-fo-field-label-content,
.biodesk-login-page .biodesk-login-access .fi-fo-field-wrp-helper-text {
    color: #304750 !important;
}
.biodesk-login-page .biodesk-login-access .fi-fo-field-label-required-mark {
    color: #dc2626 !important;
}
.biodesk-login-page .biodesk-login-access .fi-input-wrp {
    border-color: #d4dce0 !important;
    background: #fff !important;
    box-shadow: 0 0 0 1px #d4dce0 !important;
}
.biodesk-login-page .biodesk-login-access .fi-input {
    color: #203b45 !important;
    background: transparent !important;
    -webkit-text-fill-color: #203b45;
}
.biodesk-login-page .biodesk-login-access input::placeholder {
    color: #839197 !important;
    opacity: 1;
}
.biodesk-login-page .biodesk-login-access .fi-input-wrp button {
    color: #687b82 !important;
}
.biodesk-login-page .biodesk-login-access input[type='checkbox'] {
    background: #fff !important;
    border-color: #c8d2d5 !important;
    -webkit-text-fill-color: initial;
    box-shadow: 0 0 0 1px #c8d2d5 !important;
}
.biodesk-login-page .biodesk-login-access input[type='checkbox']:checked {
    background-color: var(--biodesk-teal) !important;
    box-shadow: none !important;
}
.biodesk-login-page .biodesk-login-access .fi-fo-field-wrp-error-message {
    color: #dc2626 !important;
}

/* White transparent BioDesk mark in the control panel's dark header. */
.dark .fi-panel-controlpanel img.fi-logo[src*="biodesk-boceto6.png"] {
    filter: brightness(0) invert(1);
}