/* YWD Client Portal — brand refresh 1.0.1
   Brand palette: #000000 / #ffffff / #f7941d ONLY.
   Other visual tones are translucencies of those three colors.
   No database, configuration, or application behavior changes. */
:root {
  --ywd-black: #000000;
  --ywd-white: #ffffff;
  --ywd-orange: #f7941d;
  --ywd-muted: rgba(0,0,0,.63);
  --ywd-line: rgba(0,0,0,.13);
  --ywd-paper: rgba(0,0,0,.035);
  --bs-body-color: #000000;
  --bs-body-bg: #ffffff;
  --bs-primary: #f7941d;
  --bs-primary-rgb: 247,148,29;
  --bs-secondary: #000000;
  --bs-secondary-rgb: 0,0,0;
  --bs-success: #000000;
  --bs-success-rgb: 0,0,0;
  --bs-danger: #000000;
  --bs-danger-rgb: 0,0,0;
  --bs-warning: #f7941d;
  --bs-warning-rgb: 247,148,29;
  --bs-info: #f7941d;
  --bs-info-rgb: 247,148,29;
  --bs-light: #ffffff;
  --bs-light-rgb: 255,255,255;
  --bs-dark: #000000;
  --bs-dark-rgb: 0,0,0;
  --bs-link-color: #000000;
  --bs-link-hover-color: #000000;
  --bs-focus-ring-color: rgba(247,148,29,.42);
  --bs-border-color: rgba(0,0,0,.14);
  --bs-secondary-color: rgba(0,0,0,.67);
  --bs-tertiary-color: rgba(0,0,0,.58);
  --bs-tertiary-bg: rgba(0,0,0,.04);
  color-scheme: light;
}
* { box-sizing: border-box; }
body { margin:0; background:var(--ywd-paper); color:var(--ywd-black); font-family:system-ui,-apple-system,"Segoe UI",Arial,sans-serif; font-size:15px; }
a { color:var(--ywd-black); text-decoration:underline; text-decoration-color:var(--ywd-orange); text-underline-offset:3px; }
a:hover { color:var(--ywd-black); text-decoration-color:var(--ywd-black); }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:2px solid var(--ywd-orange); outline-offset:2px; }
h1,h2,h3 { letter-spacing:-.025em; }
h2 { font-weight:650; }
.text-muted,.text-secondary { color:var(--ywd-muted)!important; }
.text-primary,.text-success,.text-danger,.text-info,.text-warning { color:var(--ywd-black)!important; }
.bg-light { background-color:var(--ywd-paper)!important; }
.bg-primary,.bg-warning,.bg-info { background-color:var(--ywd-orange)!important; color:var(--ywd-black)!important; }
.bg-success,.bg-danger,.bg-secondary,.bg-dark { background-color:var(--ywd-black)!important; color:var(--ywd-white)!important; }
.bg-white { background-color:var(--ywd-white)!important; }
.card,.dropdown-menu,.modal-content,.list-group-item { color:var(--ywd-black); background-color:var(--ywd-white); border-color:var(--ywd-line); }
.card { border-radius:14px; }
.btn { font-weight:600; --bs-btn-focus-shadow-rgb:247,148,29; }
.btn-primary,.btn-warning,.btn-info {
  --bs-btn-color:#000000; --bs-btn-bg:#f7941d; --bs-btn-border-color:#f7941d;
  --bs-btn-hover-color:#000000; --bs-btn-hover-bg:#f7941d; --bs-btn-hover-border-color:#000000;
  --bs-btn-active-color:#000000; --bs-btn-active-bg:#f7941d; --bs-btn-active-border-color:#000000;
  --bs-btn-disabled-color:#000000; --bs-btn-disabled-bg:#f7941d; --bs-btn-disabled-border-color:#f7941d;
}
.btn-primary:hover,.btn-warning:hover,.btn-info:hover { box-shadow:inset 0 0 0 1px var(--ywd-black); }
.btn-outline-primary,.btn-outline-warning,.btn-outline-info {
  --bs-btn-color:#000000; --bs-btn-border-color:#f7941d;
  --bs-btn-hover-color:#000000; --bs-btn-hover-bg:#f7941d; --bs-btn-hover-border-color:#f7941d;
  --bs-btn-active-color:#000000; --bs-btn-active-bg:#f7941d; --bs-btn-active-border-color:#f7941d;
}
.btn-secondary,.btn-dark,.btn-danger,.btn-success {
  --bs-btn-color:#ffffff; --bs-btn-bg:#000000; --bs-btn-border-color:#000000;
  --bs-btn-hover-color:#ffffff; --bs-btn-hover-bg:#000000; --bs-btn-hover-border-color:#f7941d;
  --bs-btn-active-color:#ffffff; --bs-btn-active-bg:#000000; --bs-btn-active-border-color:#f7941d;
}
.btn-outline-secondary,.btn-outline-dark,.btn-outline-danger,.btn-outline-success {
  --bs-btn-color:#000000; --bs-btn-border-color:#000000;
  --bs-btn-hover-color:#ffffff; --bs-btn-hover-bg:#000000; --bs-btn-hover-border-color:#000000;
}
.btn-outline-light { --bs-btn-color:#ffffff; --bs-btn-border-color:rgba(255,255,255,.7); --bs-btn-hover-color:#000000; --bs-btn-hover-bg:#ffffff; --bs-btn-hover-border-color:#ffffff; }
.form-control,.form-select,.input-group-text { color:var(--ywd-black); background-color:var(--ywd-white); border-color:rgba(0,0,0,.25); }
.form-control:focus,.form-select:focus { color:var(--ywd-black); background-color:var(--ywd-white); border-color:var(--ywd-orange); box-shadow:0 0 0 .2rem rgba(247,148,29,.23); }
.form-check-input { border-color:rgba(0,0,0,.45); }
.form-check-input:checked { background-color:var(--ywd-orange); border-color:var(--ywd-black); }
.form-check-input:focus { border-color:var(--ywd-orange); box-shadow:0 0 0 .2rem rgba(247,148,29,.22); }
.nav-pills .nav-link { color:var(--ywd-black); }
.nav-pills .nav-link.active,.nav-pills .show>.nav-link { color:var(--ywd-black); background:var(--ywd-orange); }
.nav-tabs { border-bottom-color:var(--ywd-line); }
.nav-tabs .nav-link { color:var(--ywd-black); }
.nav-tabs .nav-link.active { border-color:var(--ywd-line) var(--ywd-line) var(--ywd-white); border-top:3px solid var(--ywd-orange); color:var(--ywd-black); font-weight:700; }
.progress { background:rgba(0,0,0,.09); }
.progress-bar { background:var(--ywd-orange); color:var(--ywd-black); }
.badge { font-weight:650; letter-spacing:.01em; }
.badge.text-bg-primary,.badge.text-bg-warning,.badge.text-bg-info,.badge.text-bg-success {
  color:var(--ywd-black)!important; background:var(--ywd-orange)!important;
}
.badge.text-bg-secondary,.badge.text-bg-danger,.badge.text-bg-dark { color:var(--ywd-white)!important; background:var(--ywd-black)!important; }
.badge.text-bg-light { color:var(--ywd-black)!important; background:var(--ywd-white)!important; border:1px solid var(--ywd-line); }
.alert { --bs-alert-color:var(--ywd-black); --bs-alert-border-color:var(--ywd-orange); --bs-alert-bg:rgba(247,148,29,.105); color:var(--ywd-black); background:rgba(247,148,29,.105); border:1px solid var(--ywd-orange); }
.alert a { color:var(--ywd-black); }
.alert-success { border-left-width:5px; }
.alert-danger { background:var(--ywd-white); border:2px solid var(--ywd-black); border-left:5px solid var(--ywd-orange); }
.alert-warning,.alert-info { border-left-width:5px; }
.table { --bs-table-color:var(--ywd-black); --bs-table-bg:var(--ywd-white); --bs-table-border-color:var(--ywd-line); --bs-table-striped-bg:rgba(0,0,0,.035); --bs-table-hover-bg:rgba(247,148,29,.10); }
.page-link { color:var(--ywd-black); border-color:var(--ywd-line); }
.page-link:hover,.page-item.active .page-link { background:var(--ywd-orange); color:var(--ywd-black); border-color:var(--ywd-orange); }
/* Brand asset is the exact supplied YWD logo; it is placed on white for contrast. */
.brand-logo-frame { background:var(--ywd-white); border-radius:11px; width:100%; display:block; padding:11px; }
.brand-logo { display:block; width:100%; height:auto; }
.brand-portal-label { display:block; margin-top:13px; color:var(--ywd-orange); letter-spacing:.23em; font-weight:750; font-size:10px; text-align:center; }
.auth-brand { max-width:220px; margin-left:auto; margin-right:auto; }
.auth-brand img { display:block; max-width:100%; height:auto; }
.app-shell { display:flex; min-height:100vh; }
.app-sidebar { width:258px; background:var(--ywd-black); color:var(--ywd-white); padding:24px 18px; display:flex; flex-direction:column; position:sticky; top:0; height:100vh; flex-shrink:0; }
.sidebar-brand { display:flex; flex-direction:column; align-items:center; padding:0 8px 24px; }
.sidebar-caption { font-size:10px; font-weight:750; letter-spacing:.2em; color:rgba(255,255,255,.67); padding:0 13px; margin:12px 0; }
.side-link { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:10px; margin:3px 0; color:rgba(255,255,255,.85); font-size:14px; font-weight:550; text-decoration:none; }
.side-link .bi { font-size:17px; }
.side-link:hover,.side-link.is-active { color:var(--ywd-white); background:rgba(255,255,255,.11); text-decoration:none; }
.side-link.is-active { box-shadow:inset 4px 0 var(--ywd-orange); font-weight:750; }
.sidebar-bottom { margin-top:auto; padding:22px 10px 4px; border-top:1px solid rgba(255,255,255,.25); }
.main-area { min-width:0; flex:1; display:flex; flex-direction:column; }
.topbar { height:75px; background:var(--ywd-white); border-bottom:1px solid var(--ywd-line); padding:0 36px; display:flex; align-items:center; justify-content:space-between; }
.topbar-user { font-size:13px; color:var(--ywd-black); }
.content-area { width:100%; max-width:1430px; padding:38px 38px 55px; margin:0 auto; flex:1; }
.page-heading { margin-bottom:28px; }
.page-heading h1 { font-size:31px; font-weight:750; margin:0 0 5px; }
.panel { background:var(--ywd-white); border:1px solid var(--ywd-line); border-radius:15px; padding:25px; box-shadow:0 3px 20px rgba(0,0,0,.045); }
.panel-title { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:15px; }
.panel-title h2 { font-size:18px; margin:0; }
.panel h2.h5 { font-size:18px; }
.metric-card { padding:23px 25px; background:var(--ywd-white); border:1px solid var(--ywd-line); border-radius:15px; min-height:124px; border-top:3px solid var(--ywd-orange); }
.metric-card>span { color:var(--ywd-muted); font-size:13px; display:block; }
.metric-card>strong { display:block; font-size:33px; letter-spacing:-.05em; margin-top:8px; line-height:1.1; }
.metric-card .progress { height:7px; }
.project-row,.task-row,.resource-row { display:flex; align-items:center; justify-content:space-between; gap:15px; padding:15px 2px; border-bottom:1px solid var(--ywd-line); color:var(--ywd-black); }
.project-row:last-child,.task-row:last-child,.resource-row:last-child { border-bottom:none; }
.project-row:hover,.task-row:hover { background:rgba(247,148,29,.06); text-decoration:none; }
.project-row span:first-child,.task-row span { min-width:0; }
.project-row strong,.task-row strong { font-size:14px; display:block; }
.project-row small,.task-row small,.resource-row small,.person-row small { font-size:12px; color:var(--ywd-muted); display:block; margin-top:3px; }
.task-row { justify-content:flex-start; }
.task-row .bi { font-size:15px; }
.empty-state { padding:22px 5px; color:var(--ywd-muted); font-size:14px; }
.person-row { padding:10px 0; border-bottom:1px solid var(--ywd-line); }
.project-task { padding:17px 1px; border-bottom:1px solid var(--ywd-line); }
.project-task:last-child { border-bottom:0; }
.task-status-select { max-width:180px; }
.timeline-item { position:relative; border-left:2px solid rgba(0,0,0,.20); margin-left:8px; padding:0 0 29px 24px; }
.timeline-item:last-child { border-left-color:transparent; }
.timeline-dot { height:13px; width:13px; background:var(--ywd-orange); border:3px solid var(--ywd-white); outline:1px solid var(--ywd-black); border-radius:50%; position:absolute; left:-8px; top:2px; }
.resource-row { justify-content:flex-start; }
.resource-row>.bi { font-size:20px; color:var(--ywd-black); }
.comment { padding:15px 0; border-bottom:1px solid var(--ywd-line); }
.comment:last-of-type { margin-bottom:20px; }
.text-prewrap { white-space:pre-wrap; overflow-wrap:anywhere; }
.app-footer { display:flex; justify-content:space-between; padding:20px 38px; color:var(--ywd-muted); font-size:12px; }
.auth-page { min-height:100vh; background:var(--ywd-black); display:grid; place-items:center; padding:30px; }
.auth-card { background:var(--ywd-white); border:2px solid var(--ywd-orange); box-shadow:0 22px 60px rgba(0,0,0,.5); border-radius:19px; padding:39px; width:100%; max-width:455px; }
.auth-card h1 { margin-bottom:8px; }
/* Installer uses an ordinary white-on-white card layout with the same palette. */
@media(max-width:900px) {
  .app-sidebar { width:210px; padding:18px 12px; }
  .sidebar-brand { padding:0 3px 17px; }
  .content-area { padding:27px 22px; }
  .topbar { padding:0 22px; }
  .app-footer { padding:17px 22px; }
}
@media(max-width:700px) {
  .app-shell { display:block; }
  .app-sidebar { position:static; width:100%; height:auto; padding:13px; }
  .sidebar-brand { padding:5px 6px 10px; flex-direction:row; justify-content:space-between; gap:15px; }
  .brand-logo-frame { width:166px; padding:7px; }
  .brand-portal-label { margin:0; text-align:right; font-size:9px; letter-spacing:.12em; }
  .sidebar-caption { display:none; }
  .app-sidebar nav { display:flex; gap:4px; flex-wrap:wrap; }
  .side-link { padding:8px 10px; font-size:12px; margin:0; }
  .side-link .bi { font-size:14px; }
  .sidebar-bottom { padding:8px 6px 2px; margin-top:8px; display:flex; justify-content:space-between; align-items:center; gap:16px; }
  .sidebar-bottom .small { margin:0!important; }
  .sidebar-bottom form { max-width:110px; }
  .content-area { padding:23px 15px; }
  .topbar { height:47px; padding:0 16px; }
  .topbar-user { display:none; }
  .page-heading h1 { font-size:25px; }
  .panel { padding:18px; }
  .app-footer { padding:18px 15px; }
  .auth-card { padding:26px; }
}