/* =========================================================
   PLANORA UNIFIED UI SYSTEM
   One file for colors, layout, forms, navbar, cards, tables,
   dropdowns, modals, pages, login/register, habits/projects.
   Include after existing CSS to override old orange/yellow/pink styles.
   ========================================================= */

:root{
  --pl-bg:#070b0d;
  --pl-bg-2:#0b1114;
  --pl-bg-3:#10171b;
  --pl-surface:rgba(17,24,28,.82);
  --pl-surface-2:rgba(24,32,37,.78);
  --pl-surface-3:rgba(31,41,47,.86);
  --pl-glass:rgba(15,22,26,.72);
  --pl-border:rgba(255,255,255,.10);
  --pl-border-strong:rgba(137,226,87,.34);
  --pl-text:#f4f6f2;
  --pl-muted:#a8b0ad;
  --pl-muted-2:#707b78;
  --pl-primary:#72df4e;
  --pl-primary-2:#9aed6a;
  --pl-primary-dark:#286b2c;
  --pl-accent:#75df55;
  --pl-danger:#ff5f5f;
  --pl-warning:#75df55;
  --pl-info:#57d6cf;
  --pl-shadow:0 24px 80px rgba(0,0,0,.48);
  --pl-shadow-soft:0 10px 32px rgba(0,0,0,.32);
  --pl-radius-xs:10px;
  --pl-radius-sm:14px;
  --pl-radius:20px;
  --pl-radius-lg:28px;
  --pl-sidebar:280px;
  --pl-font:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

*{box-sizing:border-box}
html{background:var(--pl-bg); color-scheme:dark;}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 8% 12%, rgba(117,223,85,.12), transparent 28%),
    radial-gradient(circle at 78% 8%, rgba(114,223,78,.15), transparent 34%),
    radial-gradient(circle at 80% 82%, rgba(25,210,190,.08), transparent 28%),
    linear-gradient(135deg, #050709 0%, #081014 52%, #071308 100%) !important;
  color:var(--pl-text);
  font-family:var(--pl-font);
  letter-spacing:-.01em;
}

body::before{
  content:"";
  position:fixed; inset:0; pointer-events:none; z-index:-1;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(to bottom, rgba(0,0,0,.92), rgba(0,0,0,.25));
}

a{color:var(--pl-primary-2); text-decoration:none}
a:hover{color:var(--pl-primary); text-decoration:none}

/* Unified layout */
.app-shell,.layout,.dashboard-layout,.page-shell{min-height:100vh;background:transparent!important;color:var(--pl-text)}
.main-content,.content,.page-content,.dashboard-main{
  background:transparent!important;
  color:var(--pl-text);
}

/* Sidebar / navbar */
.sidebar,.side-nav,.app-sidebar,nav.sidebar{
  background:rgba(5,8,10,.88)!important;
  border-right:1px solid var(--pl-border)!important;
  color:var(--pl-text)!important;
  backdrop-filter:blur(22px);
}
.sidebar a,.side-nav a,.app-sidebar a,.nav-link,.menu-link{
  color:var(--pl-muted)!important;
  border:1px solid transparent;
  border-radius:var(--pl-radius-sm);
  transition:.18s ease;
}
.sidebar a:hover,.side-nav a:hover,.app-sidebar a:hover,.nav-link:hover,.menu-link:hover,
.sidebar a.active,.side-nav a.active,.app-sidebar a.active,.nav-link.active,.menu-link.active{
  background:rgba(114,223,78,.10)!important;
  color:var(--pl-text)!important;
  border-color:rgba(114,223,78,.22)!important;
}
.nav-section-title,.sidebar-label,.menu-heading{
  color:var(--pl-muted-2)!important;
  text-transform:uppercase;
  letter-spacing:.16em;
  font-size:11px;
  font-weight:800;
}

/* Top bars */
.topbar,.top-nav,.header,.app-header,.command-header{
  background:rgba(12,17,20,.72)!important;
  border:1px solid var(--pl-border)!important;
  border-radius:var(--pl-radius-lg)!important;
  box-shadow:var(--pl-shadow-soft);
  backdrop-filter:blur(22px);
  color:var(--pl-text)!important;
}

/* Cards and panels */
.card,.panel,.box,.widget,.stat-card,.project-card,.habit-card,.task-card,.modal-content,.dropdown-menu,
.auth-card,.glass-card,.workspace-card,.org-card,.kanban-column,.table-wrap{
  background:linear-gradient(180deg, rgba(22,28,32,.82), rgba(13,18,21,.78))!important;
  border:1px solid var(--pl-border)!important;
  border-radius:var(--pl-radius)!important;
  box-shadow:var(--pl-shadow-soft);
  color:var(--pl-text)!important;
  backdrop-filter:blur(18px);
}
.card:hover,.panel:hover,.widget:hover,.project-card:hover,.habit-card:hover,.task-card:hover{
  border-color:rgba(114,223,78,.24)!important;
}

/* Hero / page titles */
h1,h2,h3,h4,h5,h6,.page-title,.section-title{color:var(--pl-text)!important;font-weight:850;letter-spacing:-.04em}
.lead,.subtitle,.muted,.text-muted,.small-muted{color:var(--pl-muted)!important}
.kicker,.eyebrow{color:var(--pl-accent)!important;text-transform:uppercase;letter-spacing:.18em;font-weight:850;font-size:12px}
.text-accent,.brand-accent{color:var(--pl-primary)!important}

/* Buttons */
.btn,button,.button,input[type="submit"]{
  border-radius:14px!important;
  border:1px solid var(--pl-border)!important;
  background:rgba(255,255,255,.06)!important;
  color:var(--pl-text)!important;
  font-weight:800;
  transition:.18s ease;
}
.btn:hover,button:hover,.button:hover,input[type="submit"]:hover{
  transform:translateY(-1px);
  border-color:rgba(114,223,78,.35)!important;
}
.btn-primary,.primary,.btn-success,.quick-add,.save-btn,.submit-btn{
  background:linear-gradient(135deg,var(--pl-primary-2),var(--pl-primary))!important;
  color:#071008!important;
  border-color:rgba(114,223,78,.55)!important;
  box-shadow:0 14px 38px rgba(114,223,78,.20)!important;
}
.btn-warning,.btn-orange,.btn-yellow{
  background:linear-gradient(135deg, rgba(117,223,85,.95), rgba(185,142,57,.95))!important;
  color:#12100a!important;
  border-color:rgba(117,223,85,.45)!important;
}
.btn-danger,.danger{background:rgba(255,95,95,.14)!important;color:#caffbd!important;border-color:rgba(255,95,95,.32)!important}
.btn-info,.info{background:rgba(87,214,207,.13)!important;color:#a9fffb!important;border-color:rgba(87,214,207,.26)!important}

/* Forms */
input,select,textarea,.form-control,.form-select{
  background:rgba(8,12,15,.76)!important;
  border:1px solid rgba(255,255,255,.12)!important;
  color:var(--pl-text)!important;
  border-radius:14px!important;
  outline:none!important;
  box-shadow:none!important;
}
input:focus,select:focus,textarea:focus,.form-control:focus,.form-select:focus{
  border-color:rgba(114,223,78,.55)!important;
  box-shadow:0 0 0 4px rgba(114,223,78,.10)!important;
}
input::placeholder,textarea::placeholder{color:rgba(244,246,242,.45)!important}
label,.form-label{color:var(--pl-text)!important;font-weight:800}

/* Dropdowns */
.dropdown-menu,.select-menu,.profile-menu{
  background:rgba(9,13,16,.96)!important;
  border:1px solid rgba(114,223,78,.18)!important;
  border-radius:16px!important;
  box-shadow:0 18px 60px rgba(0,0,0,.55)!important;
  overflow:hidden;
}
.dropdown-item,.dropdown-menu a{
  color:var(--pl-muted)!important;
  background:transparent!important;
}
.dropdown-item:hover,.dropdown-menu a:hover{
  color:var(--pl-text)!important;
  background:rgba(114,223,78,.10)!important;
}

/* Tables */
table{color:var(--pl-text)!important;border-collapse:separate;border-spacing:0;width:100%}
th{color:var(--pl-muted)!important;text-transform:uppercase;letter-spacing:.10em;font-size:12px;font-weight:850;background:rgba(255,255,255,.035)!important}
td,th{border-bottom:1px solid rgba(255,255,255,.07)!important;padding:14px!important}
tr:hover td{background:rgba(114,223,78,.045)!important}

/* Progress / badges */
.progress{background:rgba(255,255,255,.08)!important;border-radius:999px;overflow:hidden}
.progress-bar{background:linear-gradient(90deg,var(--pl-primary),var(--pl-primary-2))!important}
.badge,.tag,.pill{
  border-radius:999px!important;
  background:rgba(114,223,78,.12)!important;
  color:var(--pl-primary-2)!important;
  border:1px solid rgba(114,223,78,.22)!important;
}
.badge-warning,.tag-warning{background:rgba(117,223,85,.13)!important;color:#b7ff9f!important;border-color:rgba(117,223,85,.26)!important}
.badge-danger,.tag-danger{background:rgba(255,95,95,.13)!important;color:#caffbd!important;border-color:rgba(255,95,95,.26)!important}

/* Checkbox/radio */
input[type="checkbox"],input[type="radio"]{accent-color:var(--pl-primary)}
.check,.checkbox,.habit-check{
  border-color:rgba(255,255,255,.18)!important;
  background:rgba(255,255,255,.04)!important;
}
.checked,.is-done,.done{color:var(--pl-primary)!important}

/* Auth pages */
.auth-page,.login-page,.register-page{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:48px 20px;
  background:transparent!important;
}
.auth-wrap,.auth-container{
  width:min(1120px,100%);
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:28px;
}
.auth-hero{
  background:linear-gradient(160deg,rgba(20,27,31,.88),rgba(10,15,18,.78))!important;
  border:1px solid var(--pl-border)!important;
  border-radius:30px!important;
  padding:48px!important;
  box-shadow:var(--pl-shadow);
  position:relative;
  overflow:hidden;
}
.auth-hero::after{
  content:"";position:absolute;right:-80px;bottom:-80px;width:280px;height:280px;border-radius:50%;
  background:radial-gradient(circle,rgba(114,223,78,.22),transparent 65%);
}
.auth-card{padding:48px!important;border-radius:30px!important;}
.auth-card .logo,.auth-hero .logo{background:#fff!important;color:#071008;border-radius:18px;padding:14px;box-shadow:0 12px 40px rgba(255,255,255,.08)}

/* Organization */
.org-workspace,.organization-page,.org-dashboard{background:transparent!important;color:var(--pl-text)!important}
.org-tabs,.workspace-tabs,.org-nav{
  background:rgba(12,17,20,.62)!important;
  border:1px solid var(--pl-border)!important;
  border-radius:18px!important;
}
.org-tabs a,.workspace-tabs a,.org-nav a{color:var(--pl-muted)!important;border-radius:13px!important}
.org-tabs a.active,.workspace-tabs a.active,.org-nav a.active{background:rgba(114,223,78,.12)!important;color:var(--pl-text)!important}

/* Remove old mixed colors */
[style*="orange"],[style*="#f59"],[style*="#ffc"],[style*="pink"],[style*="yellow"]{border-color:var(--pl-border)!important}
.bg-warning,.bg-orange,.bg-yellow{background:rgba(117,223,85,.14)!important;color:#b7ff9f!important}
.bg-primary,.bg-success,.bg-green{background:rgba(114,223,78,.16)!important;color:var(--pl-primary-2)!important}
.bg-info,.bg-cyan{background:rgba(87,214,207,.14)!important;color:#a9fffb!important}
.bg-danger,.bg-pink,.bg-red{background:rgba(255,95,95,.13)!important;color:#caffbd!important}

/* Mobile */
@media(max-width:900px){
  .auth-wrap,.auth-container{grid-template-columns:1fr}
  .auth-hero,.auth-card{padding:28px!important}
  h1{font-size:clamp(36px,10vw,64px)!important}
  .topbar,.top-nav,.header,.app-header{border-radius:20px!important}
}