/* Parenting Pro - app styles (Bootstrap 5.3 base) */
:root {
  --pp-primary: #4f46e5;
  --pp-primary-rgb: 79, 70, 229;
  --pp-sidebar-w: 256px;
  --pp-topbar-h: 60px;
  --pp-tabbar-h: 64px;
  --pp-radius: 14px;
  --bs-primary: #4f46e5;
  --bs-primary-rgb: 79, 70, 229;
  --bs-link-color: #4f46e5;
  --bs-link-color-rgb: 79, 70, 229;
  --bs-link-hover-color: #4338ca;
  --bs-body-font-family: 'Inter', -apple-system, 'Segoe UI', Roboto, sans-serif;
  --bs-body-bg: #f6f7fb;
  --bs-border-radius: .6rem;
  --pp-card-bg: #fff;
  --pp-soft: #eef0fb;
}
[data-bs-theme=dark] {
  --bs-body-bg: #0f1220;
  --pp-card-bg: #171a2b;
  --pp-soft: #1f2340;
  --bs-link-color: #a5b4fc;
  --bs-link-color-rgb: 165, 180, 252;
  --bs-link-hover-color: #c7d2fe;
}
body { font-size: .95rem; -webkit-font-smoothing: antialiased; }
.btn-primary { --bs-btn-bg: var(--pp-primary); --bs-btn-border-color: var(--pp-primary); --bs-btn-hover-bg: #4338ca; --bs-btn-hover-border-color: #4338ca; --bs-btn-active-bg: #3730a3; --bs-btn-disabled-bg: var(--pp-primary); --bs-btn-disabled-border-color: var(--pp-primary); }
.btn-outline-primary { --bs-btn-color: var(--pp-primary); --bs-btn-border-color: var(--pp-primary); --bs-btn-hover-bg: var(--pp-primary); --bs-btn-hover-border-color: var(--pp-primary); --bs-btn-active-bg: var(--pp-primary); }
[data-bs-theme=dark] .btn-outline-primary { --bs-btn-color: #a5b4fc; --bs-btn-border-color: #6366f1; }
.text-primary { color: var(--pp-primary) !important; }
[data-bs-theme=dark] .text-primary { color: #a5b4fc !important; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: #a5b4fc; box-shadow: 0 0 0 .2rem rgba(var(--pp-primary-rgb), .18); }
.form-check-input:checked { background-color: var(--pp-primary); border-color: var(--pp-primary); }
.form-control, .form-select { min-height: 42px; }
textarea.form-control { min-height: 96px; }

/* Shell */
.app-shell { display: flex; min-height: 100vh; }
.app-sidebar { width: var(--pp-sidebar-w); flex-shrink: 0; background: var(--pp-card-bg); border-right: 1px solid var(--bs-border-color-translucent); }
@media (min-width: 992px) {
  .app-sidebar { position: sticky; top: 0; height: 100vh; overflow-y: auto; }
}
@media (max-width: 991.98px) {
  .app-sidebar.offcanvas-lg { --bs-offcanvas-width: 286px; }
}
.sidebar-inner { display: flex; flex-direction: column; min-height: 100%; padding: .85rem .85rem; }
.brand { display: flex; align-items: center; gap: .5rem; font-weight: 700; font-size: 1.1rem; color: var(--pp-primary); text-decoration: none; padding: .1rem .5rem .75rem; }
[data-bs-theme=dark] .brand { color: #a5b4fc; }
.brand .bi { color: #ec4899; }
.family-switcher .btn { background: var(--pp-soft); border: 0; border-radius: 12px; padding: .55rem .7rem; font-weight: 600; }
.family-dot { width: 32px; height: 32px; border-radius: 9px; background: var(--pp-primary); color: #fff; display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; }
.app-nav { margin-top: .6rem; gap: 1px; }
.app-nav .nav-link, .sidebar-footer .nav-link { display: flex; align-items: center; gap: .7rem; color: var(--bs-body-color); border-radius: 10px; padding: .4rem .7rem; font-weight: 500; }
.app-nav .nav-link .bi, .sidebar-footer .nav-link .bi { font-size: 1.05rem; opacity: .75; width: 1.2rem; text-align: center; }
.app-nav .nav-link:hover, .sidebar-footer .nav-link:hover { background: var(--pp-soft); }
.app-nav .nav-link.active { background: rgba(var(--pp-primary-rgb), .1); color: var(--pp-primary); font-weight: 600; }
[data-bs-theme=dark] .app-nav .nav-link.active { color: #c7d2fe; background: rgba(129, 140, 248, .16); }
.app-nav .nav-link.active .bi { opacity: 1; }
.nav-section { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--bs-secondary-color); padding: 1rem .7rem .35rem; font-weight: 600; }
.sidebar-footer { margin-top: auto; padding-top: .5rem; border-top: 1px solid var(--bs-border-color-translucent); }

.app-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.app-topbar { position: sticky; top: 0; z-index: 1020; height: var(--pp-topbar-h); display: flex; align-items: center; gap: .5rem; padding: 0 1.25rem; background: rgba(246, 247, 251, .85); backdrop-filter: blur(10px); border-bottom: 1px solid var(--bs-border-color-translucent); }
[data-bs-theme=dark] .app-topbar { background: rgba(15, 18, 32, .85); }
.topbar-title { font-weight: 600; }
.btn-icon { width: 40px; height: 40px; display: inline-flex; align-items: center; justify-content: center; border-radius: 10px; font-size: 1.2rem; padding: 0; border: 0; color: var(--bs-body-color); }
.btn-icon:hover { background: var(--pp-soft); }
.notif-badge { font-size: .62rem; margin-top: 8px; margin-left: -8px; }
.app-content { padding: 1.5rem; max-width: 1280px; width: 100%; margin: 0 auto; }
@media (max-width: 991.98px) {
  .app-content { padding: 1rem 1rem calc(var(--pp-tabbar-h) + 1.5rem + env(safe-area-inset-bottom)); }
  .app-topbar { padding: 0 .5rem; }
}
.mobile-tabbar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 1030; display: flex; background: var(--pp-card-bg); border-top: 1px solid var(--bs-border-color-translucent); padding-bottom: env(safe-area-inset-bottom); height: calc(var(--pp-tabbar-h) + env(safe-area-inset-bottom)); }
.mobile-tabbar a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; color: var(--bs-secondary-color); text-decoration: none; font-size: .7rem; font-weight: 500; }
.mobile-tabbar a .bi { font-size: 1.3rem; }
.mobile-tabbar a.active { color: var(--pp-primary); }
[data-bs-theme=dark] .mobile-tabbar a.active { color: #a5b4fc; }
.tab-dot { position: absolute; top: 10px; left: 55%; width: 8px; height: 8px; border-radius: 50%; background: #ef4444; }

.flash-stack { position: relative; }
.flash-stack .alert { border: 0; }

/* Content */
.page-header { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: .75rem; margin-bottom: 1.25rem; }
.page-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.card { --bs-card-bg: var(--pp-card-bg); border: 1px solid var(--bs-border-color-translucent); border-radius: var(--pp-radius); box-shadow: 0 1px 2px rgba(16, 24, 40, .04); }
.card-header { background: transparent; border-bottom: 1px solid var(--bs-border-color-translucent); font-weight: 600; padding: .85rem 1.1rem; display: flex; align-items: center; justify-content: space-between; gap: .5rem; }
.card-header:first-child { border-radius: var(--pp-radius) var(--pp-radius) 0 0; }
.card-body { padding: 1.1rem; }
.list-group { --bs-list-group-bg: transparent; }
.list-group-item { border-color: var(--bs-border-color-translucent); padding: .8rem 1.1rem; }
.list-group-item-action:hover { background: var(--pp-soft); }
.stat-card .stat-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); font-weight: 600; }
.stat-card .stat-value { font-size: 1.5rem; font-weight: 700; line-height: 1.2; }
.icon-tile { width: 42px; height: 42px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.2rem; flex-shrink: 0; background: var(--pp-soft); color: var(--pp-primary); }
[data-bs-theme=dark] .icon-tile { color: #a5b4fc; }
.avatar { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; color: #fff; font-weight: 600; font-size: .8rem; flex-shrink: 0; background: #64748b; }
.avatar-sm { width: 30px; height: 30px; font-size: .7rem; }
.avatar-lg { width: 56px; height: 56px; font-size: 1.1rem; }
.child-photo { width: 56px; height: 56px; border-radius: 16px; object-fit: cover; flex-shrink: 0; }
.child-photo-lg { width: 96px; height: 96px; border-radius: 22px; object-fit: cover; }
.child-initial { width: 56px; height: 56px; border-radius: 16px; display: inline-flex; align-items: center; justify-content: center; background: linear-gradient(135deg, #fde68a, #f9a8d4); color: #7c2d12; font-weight: 700; font-size: 1.3rem; flex-shrink: 0; }
.badge-soft-warning { background: #fef3c7; color: #92400e; }
.badge-soft-success { background: #dcfce7; color: #166534; }
.badge-soft-danger { background: #fee2e2; color: #991b1b; }
.badge-soft-primary { background: #e0e7ff; color: #3730a3; }
.badge-soft-secondary { background: #e2e8f0; color: #334155; }
.badge-soft-info { background: #e0f2fe; color: #075985; }
[data-bs-theme=dark] .badge-soft-warning { background: rgba(251, 191, 36, .18); color: #fcd34d; }
[data-bs-theme=dark] .badge-soft-success { background: rgba(34, 197, 94, .18); color: #86efac; }
[data-bs-theme=dark] .badge-soft-danger { background: rgba(239, 68, 68, .18); color: #fca5a5; }
[data-bs-theme=dark] .badge-soft-primary { background: rgba(129, 140, 248, .2); color: #c7d2fe; }
[data-bs-theme=dark] .badge-soft-secondary { background: rgba(148, 163, 184, .18); color: #cbd5e1; }
[data-bs-theme=dark] .badge-soft-info { background: rgba(56, 189, 248, .18); color: #7dd3fc; }
.empty-state { text-align: center; padding: 2.25rem 1rem; }
.empty-icon { width: 56px; height: 56px; margin: 0 auto .75rem; border-radius: 16px; background: var(--pp-soft); color: var(--pp-primary); display: flex; align-items: center; justify-content: center; font-size: 1.5rem; }
[data-bs-theme=dark] .empty-icon { color: #a5b4fc; }
.hero-card { background: linear-gradient(135deg, #4f46e5, #7c3aed 60%, #db2777); color: #fff; border: 0; }
.hero-card .text-white-75 { color: rgba(255, 255, 255, .8); }
.pre-line { white-space: pre-line; }
.kv dt { font-size: .78rem; text-transform: uppercase; letter-spacing: .03em; color: var(--bs-secondary-color); font-weight: 600; }
.kv dd { margin-bottom: .8rem; }
.table > :not(caption) > * > * { background-color: transparent; }
.table thead th { font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; color: var(--bs-secondary-color); font-weight: 600; }
.filter-pills .btn { border-radius: 999px; }
.nav-pills .nav-link.active { background: var(--pp-primary); }

/* Custody strip & month grid */
.custody-strip { display: grid; grid-template-columns: repeat(7, 1fr); gap: 6px; }
.custody-day { border-radius: 10px; padding: .45rem .25rem; text-align: center; color: #fff; font-size: .72rem; line-height: 1.2; position: relative; }
.custody-day .dnum { font-size: 1rem; font-weight: 700; }
.custody-day.none { background: var(--pp-soft); color: var(--bs-secondary-color); }
.custody-day.today { outline: 3px solid #fbbf24; outline-offset: 1px; }
.custody-day.override::after { content: '★'; position: absolute; top: 2px; right: 5px; font-size: .6rem; }
.month-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.month-grid .dow { text-align: center; font-size: .7rem; font-weight: 600; color: var(--bs-secondary-color); text-transform: uppercase; padding-bottom: 2px; }
.month-cell { min-height: 58px; border-radius: 8px; padding: 4px 6px; color: #fff; font-size: .75rem; position: relative; }
.month-cell.other-month { opacity: .45; }
.month-cell .num { font-weight: 700; }
.month-cell.none { background: var(--pp-soft); color: var(--bs-secondary-color); }
.month-cell.today { outline: 3px solid #fbbf24; }
.month-cell.override::after { content: '★'; position: absolute; top: 3px; right: 6px; font-size: .65rem; }
.legend-dot { display: inline-block; width: 12px; height: 12px; border-radius: 4px; vertical-align: -1px; margin-right: 4px; }
.pattern-picker { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.pattern-picker button { border: 0; border-radius: 8px; padding: .5rem 0; color: #fff; font-weight: 700; font-size: .8rem; }

/* Calendar */
.fc { --fc-border-color: var(--bs-border-color-translucent); --fc-today-bg-color: rgba(251, 191, 36, .15); --fc-page-bg-color: transparent; font-size: .85rem; }
.fc .fc-toolbar-title { font-size: 1.15rem; font-weight: 600; }
.fc .fc-button-primary { background: var(--pp-primary); border-color: var(--pp-primary); text-transform: capitalize; }
.fc .fc-button-primary:not(:disabled).fc-button-active, .fc .fc-button-primary:not(:disabled):active { background: #3730a3; border-color: #3730a3; }
.fc .custody-bg { opacity: .16; }
.fc-event { cursor: pointer; border-radius: 6px; padding: 1px 3px; }
@media (max-width: 575.98px) { .fc .fc-toolbar { flex-direction: column; gap: .5rem; } }

/* Chat */
.chat-wrap { display: flex; flex-direction: column; height: calc(100vh - var(--pp-topbar-h) - 3rem); min-height: 420px; }
@media (max-width: 991.98px) { .chat-wrap { height: calc(100vh - var(--pp-topbar-h) - var(--pp-tabbar-h) - 2rem - env(safe-area-inset-bottom)); } }
.chat-log { flex: 1; overflow-y: auto; padding: 1rem; display: flex; flex-direction: column; gap: .35rem; }
.chat-day { text-align: center; font-size: .72rem; color: var(--bs-secondary-color); margin: .75rem 0 .25rem; font-weight: 600; }
.bubble-row { display: flex; gap: .5rem; align-items: flex-end; max-width: 82%; }
.bubble-row.mine { align-self: flex-end; flex-direction: row-reverse; }
.bubble { padding: .55rem .85rem; border-radius: 16px; background: var(--pp-soft); white-space: pre-wrap; word-wrap: break-word; overflow-wrap: anywhere; }
.bubble-row.mine .bubble { background: var(--pp-primary); color: #fff; border-bottom-right-radius: 5px; }
.bubble-row:not(.mine) .bubble { border-bottom-left-radius: 5px; }
.bubble-meta { font-size: .68rem; color: var(--bs-secondary-color); margin: 0 .35rem; white-space: nowrap; }
.bubble img { max-width: 240px; max-height: 240px; border-radius: 10px; display: block; margin-top: .35rem; }
.bubble a.att { color: inherit; text-decoration: underline; }
.bubble-row.mediator { max-width: 92%; }
.bubble-row.mediator .bubble { background: #ecfdf5; color: #064e3b; border: 1px solid #a7f3d0; white-space: normal; }
[data-bs-theme=dark] .bubble-row.mediator .bubble { background: rgba(16, 185, 129, .12); color: #d1fae5; border-color: rgba(16, 185, 129, .35); }
.bubble-row.mediator .bubble p:last-child, .bubble-row.mediator .bubble ul:last-child { margin-bottom: 0; }
.mediator-avatar { background: linear-gradient(135deg, #10b981, #0d9488); }
.chat-composer { border-top: 1px solid var(--bs-border-color-translucent); padding: .75rem; display: flex; gap: .5rem; align-items: flex-end; }
.chat-composer textarea { resize: none; min-height: 44px; max-height: 160px; border-radius: 12px; }
.typing { font-size: .8rem; color: var(--bs-secondary-color); padding: 0 1rem .5rem; }
.typing .dot { display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin: 0 1px; animation: blink 1.4s infinite both; }
.typing .dot:nth-child(2) { animation-delay: .2s; }
.typing .dot:nth-child(3) { animation-delay: .4s; }
@keyframes blink { 0%, 80%, 100% { opacity: .2; } 40% { opacity: 1; } }

/* Photos */
.photo-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: .75rem; }
.photo-grid a { display: block; aspect-ratio: 1; border-radius: 12px; overflow: hidden; background: var(--pp-soft); position: relative; }
.photo-grid img, .photo-grid video { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.photo-grid a:hover img { transform: scale(1.04); }
.photo-grid .play { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; color: #fff; font-size: 2rem; text-shadow: 0 2px 8px rgba(0,0,0,.4); }

/* Lists */
.list-item-row { display: flex; align-items: center; gap: .6rem; padding: .45rem .25rem; border-bottom: 1px dashed var(--bs-border-color-translucent); }
.list-item-row.done .item-text { text-decoration: line-through; color: var(--bs-secondary-color); }
.list-item-row .btn-del { opacity: 0; }
.list-item-row:hover .btn-del { opacity: .6; }

/* Public pages */
.auth-wrap { min-height: 100vh; display: grid; grid-template-columns: 1fr; }
@media (min-width: 992px) { .auth-wrap { grid-template-columns: 1.1fr 1fr; } }
.auth-art { display: none; background: linear-gradient(160deg, rgba(79,70,229,.92), rgba(219,39,119,.85)), url('../images/father_with_kids.png') center/cover; color: #fff; padding: 3rem; flex-direction: column; justify-content: space-between; }
@media (min-width: 992px) { .auth-art { display: flex; } }
.auth-panel { display: flex; align-items: center; justify-content: center; padding: 2rem 1.25rem; }
.auth-card { width: 100%; max-width: 420px; }
.landing-hero { background: linear-gradient(160deg, rgba(30,27,75,.88), rgba(79,70,229,.78)), url('../images/father_with_kids.png') center/cover; color: #fff; }
.feature-icon { width: 48px; height: 48px; border-radius: 14px; display: inline-flex; align-items: center; justify-content: center; font-size: 1.4rem; background: rgba(var(--pp-primary-rgb), .1); color: var(--pp-primary); }

/* Print (reports) */
@media print {
  .app-sidebar, .app-topbar, .mobile-tabbar, .no-print, .flash-stack { display: none !important; }
  .app-content { padding: 0; max-width: none; }
  body { background: #fff; font-size: 11pt; }
  .card { box-shadow: none; border: 1px solid #ccc; break-inside: avoid; }
  a { color: #000; text-decoration: none; }
}
