/* Düzen360 brand system — airy surfaces, legible desktop type and vivid data accents. */
:root{
  --app-bg:#f6f8fc;
  --card:#fff;
  --text:#26334f;
  --muted:#66738a;
  --line:#e2e8f2;
  --primary:#6678e8;
  --primary-dark:#5365d5;
  --indigo-soft:#eef1ff;
  --success:#20aa83;
  --danger:#ef6f72;
  --warning:#efb541;
  --d360-cyan:#45b9d5;
  --d360-mint:#4fc9ad;
  --d360-coral:#ff817a;
  --radius:18px;
  --shadow:0 14px 38px rgba(57,72,111,.08);
}

body{font-size:16px;line-height:1.58;color:var(--text);background:linear-gradient(180deg,#f8faff 0,#f5f8fc 44%,#f7f9fc 100%)}
.app-content{padding-top:34px}
.page-header-title{font-size:32px;font-weight:800;color:#26334f}
.page-kicker,.card-eyebrow{font-size:11px;color:#77859c}
.btn{font-size:14px;min-height:44px}
.btn-primary{background:linear-gradient(135deg,#7182ec,#5f71df);border-color:#6678e8;box-shadow:0 9px 22px rgba(102,120,232,.2)}
.btn-primary:hover{background:linear-gradient(135deg,#6375e1,#5062d1);border-color:#5365d5}
.form-label{font-size:14px;color:#42516b}
.form-control,.form-select{font-size:15px;background-color:#fff;border-color:#d9e1ed}
.form-hint{font-size:12px!important}

/* Light navigation makes long work sessions calmer and keeps the colour hierarchy clear. */
.app-sidebar{background:rgba(255,255,255,.97)!important;border-right:1px solid var(--line)!important;box-shadow:8px 0 30px rgba(52,68,105,.035)!important}
.sidebar-brand{border-color:#edf1f7;color:var(--text);padding-left:18px}
.d360-brand-mark{width:40px;height:40px;border-radius:13px;background:transparent;box-shadow:none;overflow:visible}
.d360-brand-mark img{width:40px;height:40px;display:block}
.brand-copy strong{font-size:17px;color:#293650;letter-spacing:-.45px;max-width:none}
.brand-copy strong span{color:var(--primary)}
.brand-copy small{font-size:10px;color:#8290a5;letter-spacing:.8px}
.sidebar-collapse{color:#7c889c!important}
.modern-nav .nav-section{font-size:10px;color:#9aa5b5}
.modern-nav .nav-link{color:#56657d!important;min-height:49px}
.modern-nav .nav-link-title{font-size:14px!important;font-weight:650}
.modern-nav .nav-icon{color:#76839a}
.modern-nav .nav-link:hover,.modern-nav .nav-link.active{background:#eef2ff;color:#4e61d2!important}
.modern-nav .nav-link:hover .nav-icon,.modern-nav .nav-link.active .nav-icon{color:#6073df}
.modern-nav .nav-link.active{box-shadow:inset 3px 0 #6678e8}
.modern-nav .nav-collapse .nav-link{font-size:13px;color:#6d7990!important}
.sidebar-footer{border-color:#edf1f7!important;background:#fbfcff}
.tenant-chip>span{background:#e9edff;color:#5366d6}
.tenant-chip strong{font-size:13px;color:#35425b}
.tenant-chip small{font-size:11px;color:#7b889d}

.app-header{background:rgba(255,255,255,.92)!important;border-color:#e5eaf2!important;box-shadow:0 5px 22px rgba(52,68,105,.035)}
.header-search{background:#f7f9fc;border-color:#e5eaf2;height:43px}
.header-search input{font-size:15px;color:#3f4d66}
.quick-add{font-size:14px;background:#edf1ff;color:#5366d6;padding:11px 14px}
.profile-copy strong{font-size:13px}.profile-copy small{font-size:11px}
.profile-avatar{background:linear-gradient(135deg,#e7eaff,#dce2ff);color:#5366d6}
.language-trigger{width:auto;min-width:47px;gap:4px;padding:0 8px}
.language-trigger span{font-size:10px;font-weight:800;letter-spacing:.5px}
.language-menu .dropdown-menu{min-width:175px}
.language-menu .dropdown-item{font-size:13px}
.language-menu .dropdown-item.active{background:#eef2ff;color:#5366d6}
.language-code{width:28px;height:24px;display:grid;place-items:center;border-radius:7px;background:#f0f3f8;color:#64728a;font-size:9px;font-weight:800}

/* Cards and tables */
.modern-card,.metric-card{border-color:#e1e7f0;box-shadow:0 9px 30px rgba(54,70,108,.055)}
.modern-card-header{min-height:86px;padding:23px 25px}
.modern-card-header h3{font-size:19px;color:#2d3953}
.modern-card-header p{font-size:14px}
.text-link{font-size:13px}
.modern-table thead th{font-size:11px;padding:15px 18px;background:#f8faff;color:#728097}
.modern-table tbody td{font-size:14px;padding:17px 18px;color:#47556e}
.person-cell small,.activity-row small,.deadline-row small,.deadline-date{font-size:11px}
.status-pill,.invoice-status,.tenant-status,.type-badge,.source-badge,.provider-badge{font-size:11px}
.empty-state p{font-size:13px}

/* Dashboard */
.welcome-strip{position:relative;isolation:isolate;overflow:hidden;padding:26px 28px;border:1px solid #dfe5ff;background:linear-gradient(120deg,#eef2ff 0%,#f7f9ff 48%,#ecfbf7 100%);color:#283550;box-shadow:0 14px 36px rgba(73,89,134,.08)}
.welcome-strip:before,.welcome-strip:after{content:"";position:absolute;z-index:-1;border-radius:50%}
.welcome-strip:before{width:220px;height:220px;right:8%;top:-145px;background:rgba(102,120,232,.14)}
.welcome-strip:after{width:150px;height:150px;right:-38px;bottom:-105px;background:rgba(79,201,173,.18)}
.welcome-icon{width:54px;height:54px;background:linear-gradient(135deg,#6f81eb,#596bdb);color:#fff;box-shadow:0 10px 25px rgba(102,120,232,.22)}
.welcome-strip p{font-size:11px;color:#748198}
.welcome-strip h2{font-size:22px;color:#293650}
.welcome-strip div span{font-size:14px;color:#647188}
.welcome-strip>a{font-size:13px;color:#5163cf;background:#fff;border-color:#dbe1f4;box-shadow:0 7px 18px rgba(72,88,130,.07)}
.metric-grid{gap:18px;margin-bottom:20px}
.metric-card{min-height:162px;padding:23px;border-radius:20px}
.metric-card:before{content:"";position:absolute;inset:auto 0 0;height:4px;background:var(--metric-accent,#6678e8)}
.metric-indigo{--metric-accent:#6678e8}.metric-rose{--metric-accent:#ff817a}.metric-emerald{--metric-accent:#4fc9ad}.metric-amber{--metric-accent:#efb541}
.metric-top{font-size:12px;color:#68768d}
.metric-top i{width:41px;height:41px;font-size:18px}
.metric-card strong{font-size:30px;margin:16px 0 10px;color:#293650}
.metric-card strong small{font-size:12px}.metric-card p{font-size:12px}
.metric-indigo .metric-top i{background:#edf0ff;color:#5c70df}.metric-rose .metric-top i{background:#fff0ef;color:#e96b68}.metric-emerald .metric-top i{background:#eaf9f5;color:#219f7d}.metric-amber .metric-top i{background:#fff7e5;color:#d69b26}
.chart-card,.progress-card{min-height:345px}
.mini-chart{height:242px;padding:30px 26px 21px}
.chart-value,.chart-column small{font-size:10px}
.chart-track{height:166px;width:min(34px,76%);background:#edf1f7}
.chart-track span{background:linear-gradient(180deg,#8190ee,#6577e4)}
.dual-chart-track{height:166px;display:flex;align-items:flex-end;gap:4px;width:min(48px,88%);padding:0 3px;background:linear-gradient(180deg,#f5f7fb,#edf1f7);border-radius:10px}
.dual-chart-track span{display:block;flex:1;min-height:4px;border-radius:6px 6px 3px 3px}
.dual-chart-track .income{background:linear-gradient(180deg,#65d3b8,#35b693)}
.dual-chart-track .expense{background:linear-gradient(180deg,#ff9a92,#ed7471)}
.chart-legend{display:flex;align-items:center;gap:14px;margin:5px 0 0 auto;font-size:11px;color:#738096}
.chart-legend span{display:flex;align-items:center;gap:5px}.chart-legend i{width:8px;height:8px;border-radius:50%}.chart-legend .income{background:#43bea0}.chart-legend .expense{background:#ef7773}
.completion-score{font-size:13px;background:#edf1ff;color:#5265d4}
.radial-progress{width:136px;height:136px;background:conic-gradient(#6678e8 calc(var(--progress)*1%),#edf1f6 0)}
.radial-progress:before{width:103px;height:103px}.radial-progress strong{font-size:25px}.radial-progress small{font-size:10px}
.progress-stats small{font-size:10px}.activity-row,.deadline-row{font-size:14px;padding:15px 0}

.status-distribution{padding:24px 25px 26px}
.status-distribution-bar{height:15px;display:flex;overflow:hidden;border-radius:20px;background:#eef1f6;box-shadow:inset 0 1px 2px rgba(42,56,89,.08)}
.status-distribution-bar span{min-width:3px;height:100%;transition:width .35s ease}
.status-distribution-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;margin-top:19px}
.status-distribution-list>div{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:8px;padding:10px 11px;background:#f8faff;border-radius:11px}
.status-distribution-list i{width:9px;height:9px;border-radius:50%}.status-distribution-list span{font-size:12px;color:#647188;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.status-distribution-list b{font-size:13px;color:#33415b}

/* Searchable completed-work archive */
.archive-hero{display:grid;grid-template-columns:1.4fr repeat(3,minmax(145px,.55fr));gap:14px;margin-bottom:20px}
.archive-intro,.archive-stat{border:1px solid #e0e7f1;background:#fff;border-radius:19px;padding:21px;box-shadow:0 9px 28px rgba(54,70,108,.045)}
.archive-intro{display:flex;align-items:center;gap:16px;background:linear-gradient(120deg,#f0f3ff,#fff 58%,#edfaf7)}
.archive-intro>span{width:51px;height:51px;display:grid;place-items:center;flex:0 0 auto;border-radius:15px;background:#e3e9ff;color:#5d70df;font-size:22px}
.archive-intro h2{font-size:18px;margin:0 0 4px}.archive-intro p{font-size:13px;color:#69768c;margin:0}
.archive-stat{display:flex;flex-direction:column;justify-content:center}.archive-stat small{font-size:11px;color:#758299}.archive-stat strong{font-size:24px;color:#2b3852;margin-top:5px}.archive-stat strong span{font-size:11px;color:#8390a3}
.archive-filter{display:grid;grid-template-columns:minmax(220px,1.4fr) repeat(2,minmax(150px,.7fr)) auto auto;align-items:end;gap:12px;padding:18px 21px;border-bottom:1px solid var(--line)}
.archive-filter label{display:block;margin:0}.archive-filter label>span{display:block;font-size:11px;font-weight:700;color:#6d7a90;margin-bottom:6px}.archive-filter .form-control,.archive-filter .form-select{height:43px;min-height:43px}
.archive-filter-actions{display:flex;gap:7px}.archive-task-title{display:flex;align-items:flex-start;gap:10px;min-width:240px}.archive-task-title>span{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:#eaf8f4;color:#219c7c}.archive-task-title div{display:flex;flex-direction:column}.archive-task-title small{font-size:10px;color:#8995a7;margin-top:3px}.archive-date{display:flex;flex-direction:column}.archive-date strong{font-size:13px}.archive-date small{font-size:10px;color:#8591a4;margin-top:2px}
.archive-pagination{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:15px 20px;border-top:1px solid var(--line);color:#748198;font-size:12px}.archive-pagination>div{display:flex;align-items:center;gap:10px}.archive-pagination strong{font-size:12px;color:#3e4b65}.archive-pagination .disabled{pointer-events:none;opacity:.45}

/* Auth and public payment adopt the same bright identity. */
.auth-showcase{background:linear-gradient(145deg,#eef2ff,#f9faff 54%,#ebfaf6)}
.auth-showcase:after{content:"";position:absolute;width:430px;height:430px;border:75px solid rgba(102,120,232,.1);border-radius:50%;right:-160px;bottom:-180px}
.auth-showcase h1{color:#293650}.auth-showcase p{color:#647188}.auth-showcase .eyebrow{color:#5b6fdd}
.auth-feature-grid div{border-color:#dfe5f1;background:rgba(255,255,255,.72);color:#536079;font-size:12px}
.auth-feature-grid i{color:#6174e2}.auth-orb-one{background:rgba(102,120,232,.13)}.auth-orb-two{background:rgba(79,201,173,.16)}
.auth-card-top{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:48px}.auth-card-top .auth-logo{margin:0}.auth-logo{max-width:190px;max-height:64px}
.auth-card h2{font-size:31px}.auth-card p{font-size:14px}.auth-card .form-label{font-size:14px}.auth-help{font-size:13px!important}
.payment-card-intro{background:linear-gradient(145deg,#6376e6,#5265d3);color:#fff}.payment-card-intro>p,.payment-amount small,.payment-description small,.payment-due,.payment-card-intro li{color:#e3e7ff}

@media(max-width:1399.98px){.archive-hero{grid-template-columns:1.3fr repeat(3,.6fr)}.archive-filter{grid-template-columns:1fr 1fr 1fr}.archive-filter-actions{grid-column:span 2}}
@media(max-width:1199.98px){.archive-hero{grid-template-columns:1fr 1fr 1fr}.archive-intro{grid-column:1/-1}.app-content{padding-top:27px}}
@media(max-width:767.98px){body{font-size:15px}.page-header-title{font-size:27px}.language-trigger span{display:none}.language-trigger{min-width:40px}.welcome-strip h2{font-size:18px}.welcome-strip div span{font-size:13px}.metric-card strong{font-size:26px}.archive-hero{grid-template-columns:1fr 1fr}.archive-intro{grid-column:1/-1}.archive-stat:last-child{grid-column:1/-1}.archive-filter{grid-template-columns:1fr}.archive-filter-actions{grid-column:auto}.modern-table tbody td{font-size:13px}.auth-card h2{font-size:27px}}
@media(max-width:479.98px){.archive-hero{grid-template-columns:1fr}.archive-intro,.archive-stat:last-child{grid-column:auto}.archive-intro{align-items:flex-start}.archive-filter-actions{flex-direction:column}.archive-filter-actions .btn{width:100%}.status-distribution-list{grid-template-columns:1fr}.welcome-strip{padding:20px}.metric-card{min-height:145px}}

/* Landing page colour bridge. */
.landing-body{--ink:#26334f;--navy:#2c3955;--primary:#6678e8;--primary-dark:#5365d5;--cyan:#45b9d5;--green:#20aa83;--amber:#efb541;--rose:#ef7773;--muted:#65738a;--surface:#f6f8fc}
.landing-brand>span{background:#f1f4ff;box-shadow:none;padding:3px}.landing-brand>span img{width:100%;height:100%}
.landing-nav .nav-cta{background:linear-gradient(135deg,#6f81eb,#5a6ddb)}
.landing-hero{background:linear-gradient(180deg,#f3f6ff 0%,#fff 92%)}
.hero-badge{background:#eef2ff;border-color:#dce3ff;color:#5265d4}
.landing-button.primary{background:linear-gradient(135deg,#7283ec,#6072df);box-shadow:0 12px 28px rgba(102,120,232,.25)}
.product-shell aside{background:#f7f9fd;border-right:1px solid #e3e8f1}.product-shell aside>span{color:#7c889d}.product-shell aside>span.active{color:#5669d8;background:#e8edff}.mini-brand{background:transparent url('../images/duzen360-mark.svg') center/31px 31px no-repeat}.mini-brand i{display:none}.mini-brand img{width:31px;height:31px}
.workflow-visual{background:linear-gradient(145deg,#6678e8,#5065ce);box-shadow:0 28px 65px rgba(72,91,166,.22)}
.request-section{background:linear-gradient(135deg,#5164cf,#6779e1 52%,#43aa98)}
.request-copy>p,.request-copy li,.already-member span{color:#edf0ff}.request-copy .eyebrow{color:#dfe4ff}
.landing-footer{background:#293650}
.landing-language{display:inline-flex!important;gap:3px!important;padding:3px!important;border:1px solid #dfe5ef;border-radius:10px;background:#f7f9fc}
.landing-language a{padding:6px 8px!important;border:0!important;border-radius:7px;font-size:11px!important;color:#6b7890!important}
.landing-language a.active{background:#fff;color:#5366d6!important;box-shadow:0 2px 8px rgba(53,68,105,.08)}
