/* MY (Family) RCLARO — tema visual (complementa o Bootstrap 5.3) */
:root {
  --cf-primary: #4f46e5;
  --cf-primary-dark: #4338ca;
  --cf-primary-soft: #eef2ff;
  --cf-accent: #06b6d4;
  --cf-gradient: linear-gradient(135deg, #4f46e5 0%, #6366f1 45%, #06b6d4 100%);
  --cf-bg: #f3f4f8;
  --cf-surface: #ffffff;
  --cf-surface-2: #f8fafc;
  --cf-border: rgba(15, 23, 42, .08);
  --cf-text: #0f172a;
  --cf-muted: #64748b;
  --cf-shadow: 0 1px 2px rgba(15, 23, 42, .04), 0 8px 24px -12px rgba(15, 23, 42, .12);
  --cf-sidebar: 248px;
  --cf-topbar: 60px;
  --cf-bottom-nav: 66px;
  --cf-radius: 16px;
  --bs-primary: var(--cf-primary);
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: var(--cf-primary);
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: var(--cf-primary-dark);
  --bs-link-hover-color-rgb: 67, 56, 202;
  --bs-body-font-family: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --bs-body-color: var(--cf-text);
  --bs-body-bg: var(--cf-bg);
  --bs-border-color: var(--cf-border);
}
[data-bs-theme="dark"] {
  --cf-primary: #818cf8;
  --cf-primary-dark: #a5b4fc;
  --cf-primary-soft: rgba(129, 140, 248, .14);
  --cf-bg: #0b1120;
  --cf-surface: #111a2e;
  --cf-surface-2: #0f172a;
  --cf-border: rgba(148, 163, 184, .14);
  --cf-text: #e5e7eb;
  --cf-muted: #94a3b8;
  --cf-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 10px 30px -14px rgba(0, 0, 0, .6);
  --bs-primary: var(--cf-primary);
  --bs-primary-rgb: 129, 140, 248;
  --bs-link-color: var(--cf-primary);
  --bs-link-color-rgb: 129, 140, 248;
  --bs-link-hover-color: var(--cf-primary-dark);
  --bs-body-color: var(--cf-text);
  --bs-body-bg: var(--cf-bg);
  --bs-border-color: var(--cf-border);
  --bs-secondary-color: var(--cf-muted);
  --bs-tertiary-bg: var(--cf-surface-2);
}
html, body { height: 100%; }
body { background: var(--cf-bg); color: var(--cf-text); -webkit-font-smoothing: antialiased; }
.text-secondary { color: var(--cf-muted) !important; }

/* Botões e controlos com a cor da marca */
.btn-primary { --bs-btn-bg: var(--cf-primary); --bs-btn-border-color: var(--cf-primary); --bs-btn-hover-bg: var(--cf-primary-dark); --bs-btn-hover-border-color: var(--cf-primary-dark); --bs-btn-active-bg: var(--cf-primary-dark); --bs-btn-active-border-color: var(--cf-primary-dark); --bs-btn-disabled-bg: var(--cf-primary); --bs-btn-disabled-border-color: var(--cf-primary); --bs-btn-color: #fff; --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; --bs-btn-disabled-color: #fff; --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb); }
.btn-outline-primary { --bs-btn-color: var(--cf-primary); --bs-btn-border-color: var(--cf-primary); --bs-btn-hover-bg: var(--cf-primary); --bs-btn-hover-border-color: var(--cf-primary); --bs-btn-active-bg: var(--cf-primary); --bs-btn-active-border-color: var(--cf-primary); --bs-btn-hover-color: #fff; --bs-btn-active-color: #fff; --bs-btn-focus-shadow-rgb: var(--bs-primary-rgb); }
.btn { border-radius: 10px; font-weight: 500; }
.btn-lg { border-radius: 12px; }
.btn, .form-control, .form-select { min-height: 42px; }
.btn-sm { min-height: 32px; border-radius: 8px; }
.form-control, .form-select { border-radius: 10px; border-color: var(--cf-border); background-color: var(--cf-surface); color: var(--cf-text); }
.form-control-sm, .form-select-sm { min-height: 34px; border-radius: 8px; }
.form-control:focus, .form-select:focus { border-color: var(--cf-primary); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .18); }
.form-check-input:checked { background-color: var(--cf-primary); border-color: var(--cf-primary); }
.form-check-input:focus { border-color: var(--cf-primary); box-shadow: 0 0 0 .25rem rgba(var(--bs-primary-rgb), .18); }
.input-group .btn { min-height: 0; }
.nav-pills .nav-link { color: var(--cf-muted); border-radius: 999px; font-weight: 500; white-space: nowrap; }
.nav-pills .nav-link.active { background: var(--cf-primary); color: #fff; }
.badge.text-bg-primary { background-color: var(--cf-primary) !important; }
.text-primary { color: var(--cf-primary) !important; }
.breadcrumb { font-size: .9rem; }
.breadcrumb-item + .breadcrumb-item::before { color: var(--cf-muted); }
.dropdown-menu { border-radius: 14px; border: 1px solid var(--cf-border); box-shadow: var(--cf-shadow); padding: .4rem; background: var(--cf-surface); }
.dropdown-item { border-radius: 8px; color: var(--cf-text); }
.dropdown-item:hover { background: var(--cf-primary-soft); color: var(--cf-primary); }
.alert { border: 0; border-radius: 12px; }
.table > :not(caption) > * > * { background: transparent; color: inherit; border-color: var(--cf-border); }
.table-light, .table > thead.table-light > tr > th { background: var(--cf-surface-2) !important; color: var(--cf-muted); font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; }
.list-group-item { background: transparent; color: inherit; border-color: var(--cf-border); }
.list-group-item a:not(.btn) { color: var(--cf-text); }
.modal-content { border-radius: var(--cf-radius); border: 0; background: var(--cf-surface); color: var(--cf-text); }
code { color: var(--cf-primary); background: var(--cf-primary-soft); padding: .1rem .35rem; border-radius: 6px; }
pre code { background: transparent; padding: 0; }

/* Cartões */
.card { border: 1px solid var(--cf-border); border-radius: var(--cf-radius); background: var(--cf-surface); color: var(--cf-text); box-shadow: var(--cf-shadow); }
.card-header { background: transparent; font-weight: 600; border-bottom: 1px solid var(--cf-border); padding: .9rem 1.1rem; display: flex; align-items: center; }
.card-header .bi { color: var(--cf-primary); }
.card-footer { background: var(--cf-surface-2); border-top: 1px solid var(--cf-border); border-radius: 0 0 var(--cf-radius) var(--cf-radius) !important; }
.card .list-group-item { padding: .8rem 1.1rem; }

/* Estrutura: barra lateral (desktop) + barra superior + navegação inferior (telemóvel) */
.app-sidebar { position: fixed; top: 0; bottom: 0; left: 0; width: var(--cf-sidebar); background: var(--cf-surface); border-right: 1px solid var(--cf-border); display: none; flex-direction: column; z-index: 1035; padding: 1rem .9rem; overflow-y: auto; }
.app-sidebar .brand { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--cf-text); font-weight: 700; font-size: 1.05rem; padding: .3rem .4rem 1rem; line-height: 1.15; }
.app-sidebar .brand img { width: 40px; height: 40px; border-radius: 11px; box-shadow: 0 4px 12px -4px rgba(79, 70, 229, .6); flex-shrink: 0; }
.app-sidebar .brand small { display: block; font-weight: 400; color: var(--cf-muted); font-size: .72rem; letter-spacing: .04em; text-transform: uppercase; }
.side-link { display: flex; align-items: center; gap: .75rem; padding: .62rem .85rem; border-radius: 12px; color: var(--cf-muted); text-decoration: none; font-weight: 500; transition: background .15s, color .15s; }
.side-link .bi { font-size: 1.15rem; width: 1.4rem; text-align: center; }
.side-link:hover { background: var(--cf-primary-soft); color: var(--cf-primary); }
.side-link.active { background: var(--cf-primary); color: #fff; box-shadow: 0 8px 18px -10px rgba(79, 70, 229, .8); }
.side-section { font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--cf-muted); padding: .9rem .85rem .35rem; }
.app-sidebar .side-footer { margin-top: auto; padding-top: .8rem; border-top: 1px solid var(--cf-border); }
.app-topbar { position: sticky; top: 0; z-index: 1030; height: var(--cf-topbar); background: color-mix(in srgb, var(--cf-surface) 86%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border-bottom: 1px solid var(--cf-border); display: flex; align-items: center; gap: .75rem; padding: 0 1rem; }
.app-topbar .brand-mobile { display: flex; align-items: center; gap: .5rem; font-weight: 700; color: var(--cf-text); text-decoration: none; white-space: nowrap; }
.app-topbar .brand-mobile img { width: 32px; height: 32px; border-radius: 9px; }
.app-main { padding: 1.25rem 1rem calc(var(--cf-bottom-nav) + 1.5rem); max-width: 1400px; }
@media (min-width: 992px) {
  .app-sidebar { display: flex; }
  .app-topbar, .app-main { margin-left: var(--cf-sidebar); }
  .app-main { padding: 1.5rem 2rem 2.5rem; }
  .app-topbar .brand-mobile { display: none; }
}
.app-search { max-width: 340px; flex: 1; }
.app-search .form-control { border-radius: 999px; padding-left: 2.4rem; background: var(--cf-surface-2) url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%2364748b'%3e%3cpath d='M11.742 10.344a6.5 6.5 0 1 0-1.397 1.398l3.85 3.85a1 1 0 0 0 1.415-1.414zM12 6.5a5.5 5.5 0 1 1-11 0 5.5 5.5 0 0 1 11 0'/%3e%3c/svg%3e") no-repeat .9rem center/16px; min-height: 40px; }
@media (max-width: 575px) { .app-search .form-control { font-size: .9rem; } }
.icon-btn { width: 40px; height: 40px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: var(--cf-muted); background: transparent; border: 0; flex-shrink: 0; font-size: 1.1rem; }
.icon-btn:hover { background: var(--cf-primary-soft); color: var(--cf-primary); }
.user-menu-btn { display: flex; align-items: center; gap: .55rem; border: 0; background: transparent; color: var(--cf-text); padding: .2rem .5rem .2rem .2rem; border-radius: 999px; }
.user-menu-btn:hover { background: var(--cf-primary-soft); }
.user-menu-btn::after { color: var(--cf-muted); }

/* Navegação inferior (telemóvel) */
.app-bottom-nav { position: fixed; left: 0; right: 0; bottom: 0; height: calc(var(--cf-bottom-nav) + env(safe-area-inset-bottom)); padding: .35rem .5rem calc(.35rem + env(safe-area-inset-bottom)); background: color-mix(in srgb, var(--cf-surface) 92%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border-top: 1px solid var(--cf-border); display: flex; justify-content: space-around; z-index: 1030; }
.app-bottom-nav .bottom-link { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--cf-muted); text-decoration: none; font-size: .68rem; font-weight: 500; border-radius: 12px; }
.app-bottom-nav .bottom-link i { font-size: 1.3rem; padding: .15rem .9rem; border-radius: 999px; transition: background .15s; line-height: 1.2; }
.app-bottom-nav .bottom-link.active { color: var(--cf-primary); }
.app-bottom-nav .bottom-link.active i { background: var(--cf-primary-soft); }
@media (min-width: 992px) { .app-bottom-nav { display: none; } }

/* Cabeçalho de página */
.page-head { display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: .75rem; margin-bottom: 1.25rem; }
.page-head h1 { font-weight: 700; letter-spacing: -.01em; margin: 0; }
h1, h2, h3, .h1, .h2, .h3 { font-weight: 700; letter-spacing: -.01em; }

/* Mosaicos de estatística e cabeçalho do painel */
.stat-tile { display: flex; align-items: center; gap: .9rem; padding: 1rem 1.1rem; text-decoration: none; color: inherit; transition: transform .15s, box-shadow .15s; }
.stat-tile:hover { transform: translateY(-2px); box-shadow: 0 12px 28px -14px rgba(15, 23, 42, .25); color: inherit; }
.stat-icon { width: 46px; height: 46px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.35rem; color: #fff; flex-shrink: 0; }
.stat-icon.indigo { background: linear-gradient(135deg, #6366f1, #4f46e5); }
.stat-icon.amber { background: linear-gradient(135deg, #f59e0b, #d97706); }
.stat-icon.rose { background: linear-gradient(135deg, #f43f5e, #e11d48); }
.stat-icon.emerald { background: linear-gradient(135deg, #10b981, #059669); }
.stat-icon.cyan { background: linear-gradient(135deg, #22d3ee, #06b6d4); }
.stat-value { font-size: 1.5rem; font-weight: 700; line-height: 1.1; }
.stat-label { color: var(--cf-muted); font-size: .85rem; }
.hero { background: var(--cf-gradient); color: #fff; border-radius: var(--cf-radius); padding: 1.4rem 1.5rem; position: relative; overflow: hidden; box-shadow: 0 16px 36px -18px rgba(79, 70, 229, .7); }
.hero::after { content: ""; position: absolute; right: -40px; top: -60px; width: 220px; height: 220px; border-radius: 50%; background: rgba(255, 255, 255, .12); pointer-events: none; }
.hero .eyebrow { opacity: .85; }
.hero .eyebrow::first-letter { text-transform: uppercase; }
.hero h1 { font-weight: 700; margin: 0; color: #fff; }
.hero .btn-light { color: var(--cf-primary); font-weight: 600; border-radius: 10px; }
.hero .btn-outline-light { border-radius: 10px; }
.hero > * { position: relative; }

/* Avatares e cores */
.avatar { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 50%; background: var(--avatar-color, var(--cf-primary)); color: #fff; font-weight: 600; font-size: .85rem; flex-shrink: 0; box-shadow: inset 0 -8px 14px rgba(0, 0, 0, .12); }
.avatar-sm { width: 26px; height: 26px; font-size: .65rem; }
.member-chip { background: var(--cf-surface); color: var(--cf-text); border: 1px solid var(--cf-border); font-weight: 500; padding: .45rem .8rem; border-radius: 999px; }
.member-chip .dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--chip-color); margin-right: .45rem; }
.event-dot { display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: var(--dot, var(--cf-primary)); flex-shrink: 0; }
.event-dot-lg { width: 16px; height: 16px; }
.color-swatch { position: relative; width: 34px; height: 34px; cursor: pointer; }
.color-swatch input { position: absolute; opacity: 0; width: 0; height: 0; }
.color-swatch span { display: block; width: 100%; height: 100%; border-radius: 50%; background: var(--swatch); border: 3px solid transparent; box-shadow: 0 0 0 1px rgba(0,0,0,.1); transition: transform .1s; }
.color-swatch input:checked + span { border-color: var(--cf-surface); box-shadow: 0 0 0 2px var(--swatch); transform: scale(1.1); }
.color-swatch input:focus-visible + span { outline: 2px solid var(--cf-primary); outline-offset: 2px; }
.task-check { width: 34px; height: 34px; min-height: 34px; padding: 0; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; border-radius: 50% !important; }
.task-check-placeholder { display: inline-block; width: 34px; height: 34px; flex-shrink: 0; }
.border-dashed { border: 2px dashed var(--cf-border) !important; box-shadow: none; background: transparent; }

/* Autenticação */
body.auth-body { background: var(--cf-bg); }
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: 1fr; }
@media (min-width: 992px) { .auth-wrap { grid-template-columns: 1.1fr 1fr; } }
.auth-side { background: var(--cf-gradient); color: #fff; display: none; flex-direction: column; justify-content: center; padding: 3rem 4rem; position: relative; overflow: hidden; }
@media (min-width: 992px) { .auth-side { display: flex; } }
.auth-side::before { content: ""; position: absolute; width: 420px; height: 420px; border-radius: 50%; background: rgba(255,255,255,.1); right: -120px; bottom: -160px; }
.auth-side > * { position: relative; }
.auth-side img { width: 84px; height: 84px; border-radius: 22px; box-shadow: 0 20px 40px -16px rgba(0,0,0,.5); margin-bottom: 1.5rem; }
.auth-side h2 { font-weight: 700; }
.auth-side ul { list-style: none; padding: 0; margin: 1.5rem 0 0; opacity: .95; }
.auth-side li { margin-bottom: .55rem; display: flex; gap: .6rem; align-items: center; }
.auth-form { display: flex; align-items: center; justify-content: center; padding: 1.5rem; }
.auth-card { width: 100%; max-width: 440px; border-radius: 20px; }
.auth-logo { font-size: 2.6rem; }
.auth-card .brand-lockup { display: flex; align-items: center; gap: .75rem; }
.auth-card .brand-lockup img { width: 48px; height: 48px; border-radius: 13px; }

/* Instalador */
.install-steps { display: flex; gap: .5rem; list-style: none; padding: 0; margin: 0; justify-content: center; flex-wrap: wrap; }
.install-steps li { display: flex; align-items: center; gap: .4rem; color: var(--cf-muted); font-size: .9rem; }
.install-steps li span { display: inline-flex; width: 26px; height: 26px; border-radius: 50%; align-items: center; justify-content: center; background: var(--cf-border); font-size: .8rem; font-weight: 600; }
.install-steps li.current { color: var(--cf-primary); font-weight: 600; }
.install-steps li.current span { background: var(--cf-primary); color: #fff; }
.install-steps li.done span { background: #10b981; color: #fff; }

/* Offline */
.offline-banner { position: fixed; top: var(--cf-topbar); left: 0; right: 0; z-index: 1040; background: #f59e0b; color: #1f2937; text-align: center; padding: .4rem; font-size: .875rem; }
@media (min-width: 992px) { .offline-banner { left: var(--cf-sidebar); } }

/* Agenda (FullCalendar) */
#calendar { min-height: 60vh; --fc-border-color: var(--cf-border); --fc-page-bg-color: var(--cf-surface); --fc-neutral-bg-color: var(--cf-surface-2); --fc-today-bg-color: var(--cf-primary-soft); --fc-button-bg-color: var(--cf-primary); --fc-button-border-color: var(--cf-primary); --fc-button-hover-bg-color: var(--cf-primary-dark); --fc-button-hover-border-color: var(--cf-primary-dark); --fc-button-active-bg-color: var(--cf-primary-dark); --fc-button-active-border-color: var(--cf-primary-dark); --fc-list-event-hover-bg-color: var(--cf-primary-soft); }
#calendar.is-loading { opacity: .6; }
.fc .fc-toolbar-title { font-size: 1.15rem; font-weight: 700; }
.fc .fc-toolbar-title::first-letter { text-transform: uppercase; }
.fc .fc-button { text-transform: capitalize; border-radius: 10px; font-weight: 500; }
.fc .fc-col-header-cell-cushion, .fc .fc-daygrid-day-number { color: var(--cf-muted); text-decoration: none; font-weight: 500; }
.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-number { background: var(--cf-primary); color: #fff; border-radius: 999px; min-width: 26px; text-align: center; }
.fc-event { cursor: pointer; border-radius: 8px; border: 0; padding: 1px 4px; font-size: .8rem; }
.fc-event-cancelled { opacity: .45; text-decoration: line-through; }
.fc-event-private .fc-event-title::before { content: "\F47A"; font-family: "bootstrap-icons"; margin-right: 3px; font-size: .8em; }
.fc-theme-standard td, .fc-theme-standard th, .fc-theme-standard .fc-scrollgrid { border-color: var(--cf-border); }
@media (max-width: 767px) { .fc .fc-toolbar { flex-wrap: wrap; gap: .4rem; } .fc .fc-toolbar-title { font-size: 1rem; } }

/* Registos técnicos */
.log-view { max-height: 70vh; overflow: auto; white-space: pre-wrap; word-break: break-all; background: #0f172a; color: #e2e8f0; border-radius: 0 0 var(--cf-radius) var(--cf-radius); padding: 1rem; }

/* Estados vazios */
.empty-state { text-align: center; color: var(--cf-muted); padding: 2.5rem 1rem; }
.empty-state .bi { font-size: 2.4rem; display: block; margin-bottom: .5rem; color: var(--cf-primary); opacity: .6; }

/* Botão flutuante de criação (telemóvel) */
.fab { position: fixed; right: 1rem; bottom: calc(var(--cf-bottom-nav) + env(safe-area-inset-bottom) + .9rem); z-index: 1031; }
.fab-btn { width: 56px; height: 56px; border-radius: 18px; border: 0; background: var(--cf-gradient); color: #fff; font-size: 1.5rem; display: inline-flex; align-items: center; justify-content: center; box-shadow: 0 14px 28px -12px rgba(79, 70, 229, .9); transition: transform .15s; }
.fab-btn:active { transform: scale(.94); }
.fab .dropdown-menu { min-width: 230px; }
@media (min-width: 992px) { .fab { display: none; } }