/* ============================================================
   Nu Babysitter — Booking System CSS
   File: assets/nu-babysitter-booking.css
   ============================================================ */
:root{
  --coral:#F07272; --coral-d:#D85A30; --coral-l:#FDE8E0;
  --teal:#4DBFB5;  --teal-d:#2EA89E;  --teal-l:#D8F5F2;
  --yellow:#F9C832;--yellow-l:#FEF5D5;
  --green-l:#E8F5E0;--green-d:#2A6F10;
  --cream:#FFFAF6; --white:#fff;
  --txt:#2C2018;   --txt-m:#6B5B4E;   --txt-lt:#A8998C;
  --border:#F0E4DC;
  --r:16px; --r-sm:10px; --r-pill:999px;
  --sh:0 4px 20px rgba(240,114,114,.08);
  --font:'Nunito',sans-serif;
}

/* ── SHARED ── */
.nubs-notice{padding:12px 18px;border-radius:var(--r-sm);font-size:14px;font-weight:700;margin-bottom:20px;}
.nubs-warn  {background:var(--yellow-l);color:#8B6914;border:1.5px solid var(--yellow);}
.nubs-info  {background:var(--teal-l);color:var(--teal-d);border:1.5px solid var(--teal);}
.nubs-success{background:var(--green-l);color:var(--green-d);border:1.5px solid #8ACF6A;}
.nubs-error {background:var(--coral-l);color:var(--coral-d);border:1.5px solid var(--coral);}

.nubs-btn-coral{display:inline-flex;align-items:center;gap:8px;background:var(--coral);color:#fff;font-family:var(--font);font-size:14px;font-weight:800;padding:12px 24px;border-radius:var(--r-pill);border:none;cursor:pointer;text-decoration:none;transition:all .2s;}
.nubs-btn-coral:hover{background:var(--coral-d);transform:translateY(-1px);}
.nubs-btn-teal{display:inline-flex;align-items:center;gap:8px;background:var(--teal);color:#fff;font-family:var(--font);font-size:14px;font-weight:800;padding:12px 24px;border-radius:var(--r-pill);border:none;cursor:pointer;text-decoration:none;transition:all .2s;}
.nubs-btn-teal:hover{background:var(--teal-d);}
.nubs-btn-danger{display:inline-flex;align-items:center;gap:8px;background:#E24B4A;color:#fff;font-family:var(--font);font-size:14px;font-weight:800;padding:12px 24px;border-radius:var(--r-pill);border:none;cursor:pointer;transition:all .2s;}
.nubs-btn-danger:hover{background:#A32D2D;}
.nubs-btn-outline-coral{display:inline-flex;align-items:center;gap:7px;background:transparent;color:var(--coral-d);font-family:var(--font);font-size:13px;font-weight:800;padding:10px 20px;border-radius:var(--r-pill);border:2px solid var(--coral);cursor:pointer;text-decoration:none;transition:all .2s;}
.nubs-btn-outline-coral:hover{background:var(--coral-l);}
.nubs-btn-outline-teal{display:inline-flex;align-items:center;gap:7px;background:transparent;color:var(--teal-d);font-family:var(--font);font-size:13px;font-weight:800;padding:10px 20px;border-radius:var(--r-pill);border:2px solid var(--teal);cursor:pointer;text-decoration:none;transition:all .2s;}
.nubs-btn-outline-teal:hover{background:var(--teal-l);}
.nubs-btn-ghost{background:transparent;color:var(--txt-lt);font-family:var(--font);font-size:14px;font-weight:700;padding:12px 20px;border-radius:var(--r-pill);border:1.5px solid var(--border);cursor:pointer;transition:all .2s;}
.nubs-btn-ghost:hover{background:var(--cream);}
.nubs-btn-full{width:100%;justify-content:center;}
.nubs-spinner{display:inline-block;width:15px;height:15px;border:2.5px solid rgba(255,255,255,.3);border-top-color:#fff;border-radius:50%;animation:spin .7s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

/* ── PROFILE PAGE ── */
.nubs-profile-wrap{font-family:var(--font);max-width:960px;margin:0 auto;padding:0 0 60px;}

.nubs-profile-hero{display:flex;align-items:flex-start;justify-content:space-between;gap:28px;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r);padding:32px;margin-bottom:24px;flex-wrap:wrap;box-shadow:var(--sh);}
.nubs-profile-hero-left{display:flex;gap:20px;align-items:flex-start;flex:1;min-width:0;}
.nubs-profile-avatar{width:90px;height:90px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;font-weight:900;flex-shrink:0;overflow:hidden;}
.nubs-profile-avatar img{width:100%;height:100%;object-fit:cover;}
.av-coral{background:var(--coral-l);color:var(--coral-d);}
.av-teal {background:var(--teal-l); color:var(--teal-d);}
.av-yellow{background:var(--yellow-l);color:#8B6914;}
.nubs-profile-name{font-size:26px;font-weight:900;color:var(--txt);display:flex;align-items:center;gap:8px;margin-bottom:6px;flex-wrap:wrap;}
.nubs-verified-badge{display:flex;align-items:center;}
.nubs-profile-tagline{font-size:15px;color:var(--txt-m);font-weight:600;margin-bottom:12px;}
.nubs-profile-meta-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:12px;}
.nubs-meta-pill{display:inline-flex;align-items:center;gap:5px;font-size:13px;font-weight:700;color:var(--txt-m);background:var(--cream);border:1.5px solid var(--border);padding:4px 12px;border-radius:var(--r-pill);}
.nubs-meta-pill svg{color:var(--teal);}
.pill-lang{background:var(--green-l);color:var(--green-d);border-color:#8ACF6A;}
.nubs-cert-row{display:flex;gap:8px;flex-wrap:wrap;}
.nubs-cert{font-size:11px;font-weight:800;padding:4px 11px;border-radius:var(--r-pill);}
.cert-id {background:var(--teal-l);color:var(--teal-d);}
.cert-mor{background:var(--yellow-l);color:#8B6914;}
.cert-skill{background:var(--cream);color:var(--txt-m);border:1.5px solid var(--border);}

.nubs-profile-hero-right{flex-shrink:0;width:240px;}
.nubs-rate-box{background:var(--cream);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:18px;margin-bottom:14px;}
.nubs-rate-label{font-size:11px;font-weight:900;color:var(--txt-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;}
.nubs-rate-amount{font-size:30px;font-weight:900;color:var(--coral);line-height:1;}
.nubs-rate-amount span{font-size:14px;font-weight:700;color:var(--txt-lt);}
.nubs-avail-pills{display:flex;flex-wrap:wrap;gap:5px;margin-top:10px;}
.nubs-avail-pill{font-size:11px;font-weight:700;background:var(--teal-l);color:var(--teal-d);padding:3px 10px;border-radius:var(--r-pill);}
.nubs-booking-exists{background:var(--cream);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:14px;margin-bottom:10px;}
.nubs-booking-exists-status{font-size:14px;font-weight:800;margin-bottom:4px;}
.nubs-booking-exists-type{font-size:12px;color:var(--txt-lt);font-weight:600;margin-bottom:12px;}

/* Profile sections */
.nubs-profile-section{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r);padding:28px;margin-bottom:20px;box-shadow:var(--sh);}
.nubs-section-title{font-size:18px;font-weight:900;color:var(--txt);margin-bottom:18px;padding-bottom:14px;border-bottom:1.5px solid var(--border);}
.nubs-bio-text{font-size:15px;color:var(--txt-m);line-height:1.75;font-weight:600;}

.nubs-details-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
.nubs-detail-card{background:var(--cream);border-radius:var(--r-sm);padding:18px;}
.nubs-detail-icon{font-size:22px;margin-bottom:8px;}
.nubs-detail-label{font-size:11px;font-weight:900;color:var(--txt-lt);text-transform:uppercase;letter-spacing:.08em;margin-bottom:10px;}
.nubs-detail-tags{display:flex;flex-wrap:wrap;gap:6px;}
.nubs-tag{font-size:12px;font-weight:700;padding:4px 11px;border-radius:var(--r-pill);}
.tag-age  {background:#F0E8FF;color:#6B3DB5;}
.tag-skill{background:var(--teal-l);color:var(--teal-d);}
.tag-lang {background:var(--green-l);color:var(--green-d);}
.tag-avail{background:var(--yellow-l);color:#8B6914;}

/* Schedule grid */
.nubs-schedule-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:8px;}
.nubs-schedule-day{border-radius:12px;padding:12px 8px;text-align:center;border:1.5px solid var(--border);}
.sday-on {background:var(--teal-l);border-color:var(--teal);}
.sday-off{background:var(--cream);opacity:.6;}
.nubs-sday-name{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.07em;margin-bottom:8px;}
.sday-on  .nubs-sday-name{color:var(--teal-d);}
.sday-off .nubs-sday-name{color:var(--txt-lt);}
.nubs-sday-slot{display:block;font-size:10px;font-weight:700;color:var(--teal-d);margin-bottom:3px;}
.nubs-sday-off-lbl{font-size:11px;color:var(--txt-lt);font-weight:600;}

/* ── REQUEST MODAL ── */
.nubs-modal-overlay{display:flex;align-items:flex-start;justify-content:center;padding:40px 20px;background:rgba(44,32,24,.5);position:fixed;inset:0;z-index:9999;overflow-y:auto;}
.nubs-modal{background:var(--white);border-radius:var(--r);padding:0;width:100%;max-width:560px;box-shadow:0 20px 60px rgba(0,0,0,.2);}
.nubs-modal-header{display:flex;align-items:center;justify-content:space-between;padding:24px 28px;border-bottom:1.5px solid var(--border);}
.nubs-modal-header h2{font-size:20px;font-weight:900;}
.nubs-modal-close{background:none;border:none;font-size:18px;color:var(--txt-lt);cursor:pointer;padding:4px 8px;border-radius:8px;}
.nubs-modal-close:hover{background:var(--cream);}
.nubs-modal form{padding:24px 28px;}
.nubs-modal-footer{display:flex;gap:12px;align-items:center;padding-top:20px;}

.nubs-form-group{margin-bottom:18px;}
.nubs-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:18px;}
.nubs-form-label{display:block;font-size:13px;font-weight:800;color:var(--txt-m);margin-bottom:7px;}
.nubs-optional{font-size:11px;font-weight:600;color:var(--txt-lt);font-style:italic;}
.nubs-input{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r-sm);font-family:var(--font);font-size:14px;font-weight:600;color:var(--txt);background:var(--cream);outline:none;transition:border-color .2s;}
.nubs-input:focus{border-color:var(--coral);}
.nubs-textarea{width:100%;padding:11px 14px;border:1.5px solid var(--border);border-radius:var(--r-sm);font-family:var(--font);font-size:14px;font-weight:600;color:var(--txt);background:var(--cream);outline:none;resize:vertical;transition:border-color .2s;line-height:1.65;}
.nubs-textarea:focus{border-color:var(--coral);}

.nubs-engagement-chips{display:flex;gap:8px;flex-wrap:wrap;}
.nubs-eng-chip{display:inline-flex;align-items:center;padding:9px 16px;border-radius:var(--r-pill);border:2px solid var(--border);background:var(--cream);font-family:var(--font);font-size:13px;font-weight:700;color:var(--txt-m);cursor:pointer;transition:all .18s;user-select:none;}
.nubs-eng-chip input[type=radio]{display:none;}
.nubs-eng-chip:has(input:checked),.nubs-eng-chip.eng-active{background:var(--teal);border-color:var(--teal);color:#fff;}
.nubs-eng-chip:hover{border-color:var(--teal);}

.nubs-rate-slider-row{display:flex;align-items:center;gap:12px;}
.nubs-rate-slider-row span{font-size:12px;color:var(--txt-lt);font-weight:700;white-space:nowrap;}
.nubs-range{flex:1;-webkit-appearance:none;height:5px;border-radius:var(--r-pill);background:linear-gradient(to right,var(--coral) 15%,#F0E4DC 15%);outline:none;cursor:pointer;}
.nubs-range::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--coral);border:3px solid #fff;box-shadow:0 2px 6px rgba(240,114,114,.4);cursor:pointer;}
.nubs-rate-live{font-size:18px;font-weight:900;color:var(--coral);margin-left:10px;}

/* ── BOOKING PANEL ── */
.nubs-booking-panel{background:var(--cream);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:20px;margin-top:16px;}
.nubs-bp-header{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:16px;padding-bottom:14px;border-bottom:1.5px solid var(--border);}
.nubs-bp-status{font-size:13px;font-weight:800;padding:6px 14px;border-radius:var(--r-pill);}
.bps-pending  {background:var(--yellow-l);color:#8B6914;}
.bps-accepted {background:var(--teal-l);color:var(--teal-d);}
.bps-active   {background:#E8F5E0;color:var(--green-d);}
.bps-completed{background:var(--coral-l);color:var(--coral-d);}
.bps-paid     {background:#E8F5E0;color:var(--green-d);}
.bps-declined {background:#FEE;color:#A32D2D;}
.nubs-bp-meta{display:flex;gap:10px;flex-wrap:wrap;font-size:13px;color:var(--txt-m);font-weight:600;}
.nubs-bp-meta span{background:var(--white);padding:4px 10px;border-radius:var(--r-pill);border:1.5px solid var(--border);}
.nubs-bp-message{background:var(--white);border-radius:var(--r-sm);padding:12px 16px;margin-bottom:14px;border:1.5px solid var(--border);}
.nubs-bp-msg-sitter{background:var(--teal-l);border-color:rgba(77,191,181,.3);}
.nubs-bp-msg-label{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:var(--txt-lt);margin-bottom:5px;}
.nubs-bp-msg-text{font-size:14px;font-weight:600;color:var(--txt-m);line-height:1.6;}
.nubs-bp-actions{margin-top:10px;}
.nubs-bp-btn-row{display:flex;gap:10px;margin-top:14px;}

/* Checkin area */
.nubs-checkin-card{display:flex;align-items:center;gap:16px;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:16px;}
.nubs-checkin-icon{font-size:28px;flex-shrink:0;}
.nubs-checkin-title{font-size:15px;font-weight:800;margin-bottom:3px;}
.nubs-checkin-sub{font-size:13px;color:var(--txt-lt);font-weight:600;}
.nubs-pending-confirm,.nubs-confirm-needed{display:flex;align-items:center;gap:14px;background:var(--yellow-l);border:1.5px solid var(--yellow);border-radius:var(--r-sm);padding:14px 16px;}
.nubs-confirm-needed{background:var(--coral-l);border-color:var(--coral);}
.nubs-pc-icon,.nubs-cn-icon{font-size:24px;flex-shrink:0;}
.nubs-pc-sub{font-size:12px;color:var(--txt-lt);font-weight:600;margin-top:3px;}
.nubs-cn-info{flex:1;}

/* Active session */
.nubs-bp-session{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:20px;}
.nubs-session-timer{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;flex-wrap:wrap;gap:10px;}
.nubs-session-checkin{display:flex;align-items:center;gap:6px;font-size:13px;color:var(--txt-m);font-weight:600;}
.nubs-session-live{font-size:28px;font-weight:900;color:var(--teal-d);font-family:monospace;}
.nubs-btn-checkout{background:var(--coral);}

/* Billing card */
.nubs-billing-card{border-radius:var(--r-sm);padding:20px;margin-top:14px;}
.billing-pending{background:var(--coral-l);border:1.5px solid rgba(240,114,114,.3);}
.billing-paid   {background:var(--green-l);border:1.5px solid #8ACF6A;}
.nubs-billing-row{display:flex;gap:20px;flex-wrap:wrap;}
.nubs-billing-summary{flex:1;}
.nubs-billing-title{font-size:16px;font-weight:900;margin-bottom:14px;}
.nubs-billing-table{width:100%;border-collapse:collapse;}
.nubs-billing-table tr td{padding:7px 0;border-bottom:1px solid rgba(255,255,255,.4);font-size:13px;font-weight:600;}
.nubs-billing-table tr:last-child td{border-bottom:none;}
.billing-total-row td{font-size:15px!important;padding-top:12px!important;}
.billing-total{font-size:22px!important;font-weight:900!important;color:var(--coral-d);}
.billing-paid .billing-total{color:var(--green-d)!important;}
.nubs-billing-actions{display:flex;flex-direction:column;gap:10px;justify-content:center;min-width:160px;}
.nubs-payment-note{font-size:13px;color:var(--txt-m);font-weight:600;background:rgba(255,255,255,.5);border-radius:8px;padding:10px 12px;line-height:1.55;}

/* ── MINI CARD ── */
.nubs-mini-card{display:flex;align-items:center;gap:12px;}
.nubs-mini-av{width:42px;height:42px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;overflow:hidden;flex-shrink:0;}
.nubs-mini-av img{width:100%;height:100%;object-fit:cover;}
.nubs-mini-name{font-size:14px;font-weight:800;color:var(--txt);}
.nubs-mini-meta{font-size:12px;color:var(--txt-lt);font-weight:600;margin-top:2px;}

/* ── DASHBOARDS ── */
.nubs-dashboard-wrap{font-family:var(--font);max-width:960px;margin:0 auto;padding:0 0 60px;}
.nubs-dash-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin-bottom:24px;}
.nubs-dash-title{font-size:26px;font-weight:900;color:var(--txt);}
.nubs-dash-subtitle{font-size:14px;color:var(--txt-lt);font-weight:600;}

.nubs-stats-row{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px;}
.nubs-stat-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:18px;text-align:center;}
.nubs-stat-highlight{border-color:rgba(77,191,181,.4);}
.nubs-stat-num{font-size:26px;font-weight:900;color:var(--txt);margin-bottom:4px;}
.nubs-stat-lbl{font-size:12px;font-weight:700;color:var(--txt-lt);}
.nubs-stat-warn{color:var(--coral);}
.nubs-stat-green{color:var(--green-d);}

.nubs-dash-section{margin-bottom:32px;}
.nubs-dash-section-alert .nubs-dash-section-title{color:var(--coral-d);}
.nubs-dash-section-title{font-size:16px;font-weight:900;color:var(--txt);margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.nubs-badge-count{background:var(--coral);color:#fff;font-size:11px;font-weight:900;padding:2px 9px;border-radius:var(--r-pill);}

.nubs-bookings-list{display:flex;flex-direction:column;gap:12px;}
.nubs-booking-row{display:flex;align-items:center;gap:16px;background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:16px 20px;flex-wrap:wrap;}
.nubs-history-row{opacity:.8;}
.nubs-booking-row-left{flex:1;min-width:180px;}
.nubs-booking-row-center{flex:1;min-width:160px;}
.nubs-booking-row-right{flex-shrink:0;}
.nubs-br-status{font-size:12px;font-weight:800;display:inline-block;margin-bottom:4px;}
.nubs-br-meta{font-size:13px;color:var(--txt-m);font-weight:600;}
.nubs-br-dates{font-size:12px;color:var(--txt-lt);font-weight:600;margin-top:2px;}
.nubs-br-billing{font-size:13px;font-weight:800;color:var(--teal-d);margin-top:4px;}

.nubs-request-card{background:var(--white);border:1.5px solid var(--border);border-radius:var(--r-sm);padding:20px;margin-bottom:14px;}
.nubs-rc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;flex-wrap:wrap;gap:10px;}
.nubs-rc-family{display:flex;align-items:center;gap:12px;}
.nubs-rc-name{font-size:15px;font-weight:900;}
.nubs-rc-meta{font-size:12px;color:var(--txt-lt);font-weight:600;margin-top:2px;}
.nubs-rc-date{font-size:12px;color:var(--txt-lt);font-weight:600;}
.nubs-rc-message{font-size:13px;color:var(--txt-m);font-weight:600;background:var(--cream);border-radius:8px;padding:10px 14px;margin-bottom:14px;border:1.5px solid var(--border);line-height:1.6;}

.nubs-booking-expand{margin-top:8px;padding:0 0 8px;}

/* Payroll table */
.nubs-payroll-table-wrap{overflow-x:auto;}
.nubs-payroll-table{width:100%;border-collapse:collapse;font-size:14px;}
.nubs-payroll-table th{background:var(--cream);font-size:11px;font-weight:900;color:var(--txt-lt);text-transform:uppercase;letter-spacing:.08em;padding:12px 14px;text-align:left;border-bottom:1.5px solid var(--border);}
.nubs-payroll-table td{padding:12px 14px;border-bottom:1px solid var(--border);font-weight:600;color:var(--txt-m);}
.nubs-payroll-table tr:last-child td{border-bottom:none;}
.payroll-amount{font-weight:900!important;color:var(--teal-d)!important;}
.nubs-payslip-link{color:var(--coral-d);font-weight:800;text-decoration:underline;font-size:13px;}

/* Empty dash */
.nubs-empty-dash{text-align:center;padding:60px 20px;}
.nubs-empty-icon{font-size:52px;margin-bottom:18px;}
.nubs-empty-dash h3{font-size:22px;font-weight:900;margin-bottom:10px;}
.nubs-empty-dash p{font-size:15px;color:var(--txt-m);font-weight:600;margin-bottom:24px;}

/* ── RESPONSIVE ── */
@media(max-width:768px){
  .nubs-profile-hero{flex-direction:column;}
  .nubs-profile-hero-right{width:100%;}
  .nubs-details-grid{grid-template-columns:1fr;}
  .nubs-schedule-grid{grid-template-columns:repeat(4,1fr);}
  .nubs-stats-row{grid-template-columns:repeat(2,1fr);}
  .nubs-form-row{grid-template-columns:1fr;}
  .nubs-billing-row{flex-direction:column;}
  .nubs-billing-actions{min-width:0;width:100%;}
}
@media(max-width:480px){
  .nubs-modal-overlay{padding:0;}
  .nubs-modal{border-radius:0;min-height:100vh;}
  .nubs-bp-btn-row{flex-direction:column;}
  .nubs-stats-row{grid-template-columns:1fr 1fr;}
}