/* ═══════════════════════════════════════════════
   OPWEB Design System — Light Theme Primary
═══════════════════════════════════════════════ */

:root {
  /* ── LIGHT THEME (default) ── */
  --c-bg:           #f2f2f7;
  --c-bg1:          #ffffff;
  --c-bg2:          #f2f2f7;
  --c-surface:      #ffffff;
  --c-surface-high: #ffffff;
  --c-glass:        rgba(255,255,255,0.85);
  --c-glass-border: rgba(0,0,0,0.10);
  --c-glass-hover:  rgba(0,0,0,0.04);

  --c-text:    #000000;
  --c-text-2:  rgba(0,0,0,0.60);
  --c-text-3:  rgba(0,0,0,0.40);
  --c-text-4:  rgba(0,0,0,0.15);

  --c-accent:   #5e6ad2;
  --c-accent-l: #4a54b8;
  --c-accent-bg:rgba(94,106,210,0.10);

  --c-green:    #1a8f3c;
  --c-green-bg: rgba(26,143,60,0.10);
  --c-red:      #d63031;
  --c-red-bg:   rgba(214,48,49,0.10);
  --c-yellow:   #c07800;
  --c-yellow-bg:rgba(192,120,0,0.10);
  --c-blue:     #0070c9;

  --blur-sm: blur(8px);
  --blur-md: blur(20px);
  --blur-lg: blur(40px);

  --r-xs:  6px; --r-sm: 10px; --r-md: 14px;
  --r-lg:  18px; --r-xl: 24px; --r-full: 999px;

  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px;
  --sp-5:20px; --sp-6:24px; --sp-8:32px;

  --ease-spring: cubic-bezier(0.34,1.56,0.64,1);
  --ease-out:    cubic-bezier(0.16,1,0.3,1);
  --dur-fast:150ms; --dur-med:260ms; --dur-slow:380ms;

  --sat: env(safe-area-inset-top,0px);
  --sab: env(safe-area-inset-bottom,0px);
  --sal: env(safe-area-inset-left,0px);
  --sar: env(safe-area-inset-right,0px);

  --tab-h: 60px;
  --tab-total: calc(var(--tab-h) + var(--sab));
  --topbar-h: 56px;
}

/* ── RESET ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;-webkit-tap-highlight-color:transparent;}
body{
  font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',sans-serif;
  background:var(--c-bg); color:var(--c-text);
  min-height:100dvh; -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
a{color:var(--c-accent);text-decoration:none;}
a:hover{text-decoration:underline;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;}

/* ── SCROLLBAR ── */
*{scrollbar-width:thin;scrollbar-color:rgba(0,0,0,0.2) transparent;}
::-webkit-scrollbar{width:4px;height:4px;}
::-webkit-scrollbar-thumb{background:rgba(0,0,0,0.2);border-radius:2px;}

/* ══════════════════════════════════════════════
   LAYOUT
══════════════════════════════════════════════ */
.app-screen{
  display:flex; flex-direction:column; min-height:100dvh;
  /* Mobile: space for bottom tab */
  padding-bottom:var(--tab-total);
}
.page-content{
  flex:1; padding:var(--sp-4);
  padding-top:calc(var(--topbar-h) + var(--sat) + var(--sp-5));
  max-width:1100px; margin:0 auto; width:100%;
}
@media(min-width:768px){
  .page-content{
    padding:calc(var(--topbar-h) + var(--sat) + var(--sp-6)) var(--sp-6) var(--sp-6);
  }
}

/* ══════════════════════════════════════════════
   TOP BAR
══════════════════════════════════════════════ */
.top-bar{
  position:fixed; top:0; left:0; right:0; z-index:200;
  height:calc(var(--topbar-h) + var(--sat));
  padding-top:var(--sat);
  background:rgba(242,242,247,0.88);
  -webkit-backdrop-filter:var(--blur-lg);
  backdrop-filter:var(--blur-lg);
  border-bottom:0.5px solid rgba(0,0,0,0.12);
}
.top-bar-inner{
  display:flex; align-items:center; justify-content:space-between;
  height:var(--topbar-h); padding:0 var(--sp-4);
  position:relative;
}
.top-bar-logo{
  font-size:20px; font-weight:800; letter-spacing:-1px;
  color:var(--c-accent); text-decoration:none;
  flex-shrink:0;
}
.top-bar-logo:hover{text-decoration:none;color:var(--c-accent-l);}
.top-bar-center{
  position:absolute; left:50%; transform:translateX(-50%);
  font-size:17px; font-weight:600; letter-spacing:-0.4px;
  color:var(--c-text); white-space:nowrap;
  max-width:calc(100% - 240px); overflow:hidden; text-overflow:ellipsis;
}
.top-bar-action{display:flex;gap:6px;align-items:center;flex-shrink:0;}

/* Desktop: show nav links in top bar */
.top-bar-nav{
  display:none; /* hidden on mobile */
  gap:2px; align-items:center;
}
.top-bar-nav a,.top-bar-nav button{
  padding:7px 12px; border-radius:var(--r-sm);
  color:var(--c-text-2); font-size:14px; font-weight:500;
  border:none; background:none; cursor:pointer;
  transition:all var(--dur-fast) ease; text-decoration:none;
  display:flex; align-items:center; gap:5px; white-space:nowrap;
}
.top-bar-nav a:hover,.top-bar-nav button:hover{background:rgba(0,0,0,0.06);color:var(--c-text);text-decoration:none;}
.top-bar-nav a.active{background:rgba(94,106,210,0.12);color:var(--c-accent);}

/* ══════════════════════════════════════════════
   BOTTOM TAB BAR (mobile only)
══════════════════════════════════════════════ */
.tab-bar{
  position:fixed; bottom:0; left:0; right:0; z-index:200;
  height:var(--tab-total); padding-bottom:var(--sab);
  background:rgba(242,242,247,0.92);
  -webkit-backdrop-filter:var(--blur-lg); backdrop-filter:var(--blur-lg);
  border-top:0.5px solid rgba(0,0,0,0.12);
  display:flex; align-items:flex-start; padding-top:4px;
}
.tab-bar-item{
  flex:1; display:flex; flex-direction:column; align-items:center;
  gap:2px; padding:5px 0; background:none; border:none;
  color:var(--c-text-3); font-size:10px; font-weight:500;
  transition:color var(--dur-fast) ease;
  cursor:pointer; text-decoration:none;
}
.tab-bar-item .tab-icon{width:24px;height:24px;transition:transform var(--dur-fast) var(--ease-spring);flex-shrink:0;}
.tab-bar-item.active{color:var(--c-accent);}
.tab-bar-item.active .tab-icon{transform:scale(1.1);}
.tab-bar-item:active .tab-icon{transform:scale(0.88);}

/* ── DESKTOP OVERRIDES ── */
@media(min-width:768px){
  .tab-bar{display:none;}
  .app-screen{padding-bottom:0;}
  .page-content{padding-top:calc(var(--topbar-h) + var(--sat) + var(--sp-6));padding:calc(var(--topbar-h) + var(--sat) + var(--sp-6)) var(--sp-6) var(--sp-6);}
  .top-bar-nav{display:flex;}
  .top-bar-center{max-width:calc(100% - 500px);}
  .top-bar-action .hide-desktop{display:none;}
}

/* ══════════════════════════════════════════════
   BUTTONS
══════════════════════════════════════════════ */
.btn{
  display:inline-flex; align-items:center; gap:6px;
  font-size:15px; font-weight:600; letter-spacing:-0.2px;
  border:none; cursor:pointer; border-radius:var(--r-full);
  padding:10px 18px; transition:all var(--dur-fast) ease;
  white-space:nowrap; text-decoration:none;
}
.btn:active{transform:scale(0.95);}
.btn-primary{background:var(--c-accent);color:#fff;}
.btn-primary:hover{background:var(--c-accent-l);color:#fff;text-decoration:none;}
.btn-ghost{background:rgba(0,0,0,0.06);border:0.5px solid rgba(0,0,0,0.12);color:var(--c-text-2);}
.btn-ghost:hover{background:rgba(0,0,0,0.10);color:var(--c-text);text-decoration:none;}
.btn-danger{background:var(--c-red-bg);color:var(--c-red);border:0.5px solid rgba(214,48,49,0.25);}
.btn-success{background:var(--c-green-bg);color:var(--c-green);border:0.5px solid rgba(26,143,60,0.25);}
.btn-sm{padding:7px 14px;font-size:13px;}
.btn-xs{padding:5px 10px;font-size:12px;}
.btn-icon{
  width:34px;height:34px;padding:0;border-radius:var(--r-sm);
  background:rgba(0,0,0,0.06);border:0.5px solid rgba(0,0,0,0.10);
  color:var(--c-text-2);font-size:16px;
  display:flex;align-items:center;justify-content:center;
}
.btn-icon:hover{background:rgba(0,0,0,0.10);color:var(--c-text);}
.w-full{width:100%;} .flex-center{display:flex;align-items:center;justify-content:center;}
.flex-between{display:flex;align-items:center;justify-content:space-between;}

/* ══════════════════════════════════════════════
   INPUTS
══════════════════════════════════════════════ */
.input{
  width:100%; padding:12px 14px;
  background:#fff; border:1px solid rgba(0,0,0,0.18);
  border-radius:var(--r-md); color:var(--c-text);
  font-size:16px; outline:none;
  transition:border-color var(--dur-fast) ease,box-shadow var(--dur-fast) ease;
  -webkit-appearance:none;
}
.input:focus{border-color:var(--c-accent);box-shadow:0 0 0 3px rgba(94,106,210,0.15);}
.input::placeholder{color:var(--c-text-3);}
select.input{cursor:pointer;background-color:#fff;}
.input-label{display:block;font-size:12px;font-weight:600;letter-spacing:0.5px;text-transform:uppercase;color:var(--c-text-3);margin-bottom:6px;}
.input-group{display:flex;flex-direction:column;gap:5px;}

/* ══════════════════════════════════════════════
   SHEET (bottom sheet / modal)
══════════════════════════════════════════════ */
.sheet-overlay{
  position:fixed;inset:0;z-index:400;
  background:rgba(0,0,0,0);
  display:flex;align-items:flex-end;justify-content:center;
  pointer-events:none;
  transition:background var(--dur-med) ease;
}
.sheet-overlay.open{background:rgba(0,0,0,0.35);pointer-events:all;}
@media(min-width:768px){.sheet-overlay{align-items:center;}}

.sheet{
  width:100%; max-width:560px;
  background:var(--c-bg1);
  border-radius:var(--r-xl) var(--r-xl) 0 0;
  border:0.5px solid rgba(0,0,0,0.10);
  box-shadow:0 -4px 40px rgba(0,0,0,0.15);
  transform:translateY(100%);
  transition:transform var(--dur-slow) var(--ease-spring);
  max-height:92dvh; display:flex; flex-direction:column;
  padding-bottom:var(--sab); will-change:transform;
}
.sheet-overlay.open .sheet{transform:translateY(0);}
@media(min-width:768px){
  .sheet{border-radius:var(--r-xl);max-height:88vh;transform:scale(0.94) translateY(12px);opacity:0;transition:transform var(--dur-slow) var(--ease-spring),opacity var(--dur-med) ease;}
  .sheet-overlay.open .sheet{transform:scale(1) translateY(0);opacity:1;}
}

.sheet-handle{width:36px;height:4px;background:rgba(0,0,0,0.15);border-radius:2px;margin:10px auto 0;flex-shrink:0;}
.sheet-header{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-4) var(--sp-5) var(--sp-3);border-bottom:0.5px solid rgba(0,0,0,0.10);flex-shrink:0;}
.sheet-title{font-size:17px;font-weight:700;color:var(--c-text);}
.sheet-close{width:28px;height:28px;border-radius:var(--r-full);background:rgba(0,0,0,0.08);border:none;color:var(--c-text-2);font-size:14px;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.sheet-close:hover{background:rgba(0,0,0,0.14);}
.sheet-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:var(--sp-5);display:flex;flex-direction:column;gap:var(--sp-4);}

/* ══════════════════════════════════════════════
   CARDS & SURFACES
══════════════════════════════════════════════ */
/* Firsat kart */
.firsat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--sp-3);}
.firsat-kart{
  background:var(--c-surface); border:0.5px solid rgba(0,0,0,0.10);
  border-radius:var(--r-lg); padding:var(--sp-5);
  box-shadow:0 1px 4px rgba(0,0,0,0.06);
  transition:box-shadow var(--dur-fast) ease,transform var(--dur-fast) ease;
  cursor:pointer;
}
.firsat-kart:hover{box-shadow:0 4px 16px rgba(0,0,0,0.12);}
.firsat-kart:active{transform:scale(0.98);}

/* ══════════════════════════════════════════════
   PERSON CARD
══════════════════════════════════════════════ */
.kisi-main-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:var(--sp-3);}
.modal-kisi-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:var(--sp-2);}
@media(min-width:768px){.kisi-main-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));}.modal-kisi-grid{grid-template-columns:repeat(auto-fill,minmax(110px,1fr));}}

.person-card{
  background:var(--c-surface); border:1px solid rgba(0,0,0,0.10);
  border-radius:var(--r-md); padding:14px 8px 12px;
  display:flex;flex-direction:column;align-items:center;gap:5px;
  cursor:pointer; position:relative;
  box-shadow:0 1px 3px rgba(0,0,0,0.05);
  transition:all var(--dur-fast) var(--ease-spring);
  user-select:none;-webkit-user-select:none;
}
.person-card:hover{border-color:var(--c-accent);box-shadow:0 2px 10px rgba(94,106,210,0.15);}
.person-card:active{transform:scale(0.94);}
.person-card.selected{border-color:var(--c-yellow) !important;background:rgba(192,120,0,0.06) !important;}
.person-card.added{border-color:rgba(26,143,60,0.5);background:rgba(26,143,60,0.05);}

.pc-cin{position:absolute;top:7px;left:7px;line-height:0;}
.pc-src{position:absolute;bottom:6px;right:6px;font-size:8px;font-weight:700;color:var(--c-text-3);background:rgba(0,0,0,0.06);padding:1px 5px;border-radius:3px;letter-spacing:.5px;}
.pc-chk{display:none;position:absolute;top:7px;left:7px;width:18px;height:18px;border-radius:5px;border:1.5px solid rgba(0,0,0,0.2);background:#fff;align-items:center;justify-content:center;font-size:10px;}
.bulk-mode .pc-chk{display:flex;}
.selected .pc-chk{background:var(--c-yellow);border-color:var(--c-yellow);color:#fff;}
.pc-name{font-size:12px;font-weight:600;text-align:center;line-height:1.3;color:var(--c-text);word-break:break-word;}
.pc-sub{font-size:10px;color:var(--c-text-3);text-align:center;}

/* ══════════════════════════════════════════════
   AVATAR
══════════════════════════════════════════════ */
.avatar{border-radius:var(--r-full);display:flex;align-items:center;justify-content:center;font-weight:700;flex-shrink:0;background:var(--c-accent-bg);color:var(--c-accent);}
.avatar-sm{width:34px;height:34px;font-size:12px;}
.avatar-md{width:44px;height:44px;font-size:16px;}
.avatar-lg{width:56px;height:56px;font-size:20px;}

/* ══════════════════════════════════════════════
   BADGE
══════════════════════════════════════════════ */
.badge{display:inline-flex;align-items:center;gap:3px;padding:3px 8px;border-radius:var(--r-full);font-size:12px;font-weight:600;}
.badge-green {background:var(--c-green-bg);color:var(--c-green);border:0.5px solid rgba(26,143,60,0.25);}
.badge-red   {background:var(--c-red-bg);  color:var(--c-red);  border:0.5px solid rgba(214,48,49,0.25);}
.badge-yellow{background:var(--c-yellow-bg);color:var(--c-yellow);border:0.5px solid rgba(192,120,0,0.25);}
.badge-blue  {background:rgba(0,112,201,.10);color:var(--c-blue);border:0.5px solid rgba(0,112,201,.25);}
.badge-gray  {background:rgba(0,0,0,0.06);color:var(--c-text-2);border:0.5px solid rgba(0,0,0,0.10);}

/* ══════════════════════════════════════════════
   SEGMENTED CONTROL
══════════════════════════════════════════════ */
.seg-ctrl{display:flex;background:rgba(0,0,0,0.08);border-radius:var(--r-sm);padding:2px;gap:2px;}
.seg-btn{flex:1;padding:7px 12px;border-radius:calc(var(--r-sm) - 2px);border:none;background:none;color:var(--c-text-2);font-size:13px;font-weight:500;cursor:pointer;transition:all var(--dur-fast) var(--ease-spring);display:flex;align-items:center;justify-content:center;gap:5px;white-space:nowrap;}
.seg-btn.active{background:#fff;color:var(--c-text);box-shadow:0 1px 4px rgba(0,0,0,0.15);}
.seg-count{background:rgba(0,0,0,0.08);color:var(--c-text-2);font-size:10px;font-weight:700;padding:1px 6px;border-radius:var(--r-full);min-width:18px;text-align:center;}
.seg-btn.active .seg-count{background:var(--c-accent-bg);color:var(--c-accent);}

/* ══════════════════════════════════════════════
   SEARCH BAR
══════════════════════════════════════════════ */
.search-bar{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid rgba(0,0,0,0.15);border-radius:var(--r-sm);padding:0 12px;}
.search-bar:focus-within{border-color:var(--c-accent);box-shadow:0 0 0 3px rgba(94,106,210,0.12);}
.search-bar input{flex:1;background:none;border:none;outline:none;color:var(--c-text);font-size:16px;padding:10px 0;}
.search-bar input::placeholder{color:var(--c-text-3);}
.s-icon{color:var(--c-text-3);font-size:15px;flex-shrink:0;}
.s-clr{background:none;border:none;color:var(--c-text-3);font-size:14px;cursor:pointer;padding:4px;}
.s-clr:hover{color:var(--c-text);}

/* ══════════════════════════════════════════════
   SELECT PILL
══════════════════════════════════════════════ */
.select-pill{background:#fff;border:1px solid rgba(0,0,0,0.15);border-radius:var(--r-full);padding:7px 12px;color:var(--c-text-2);font-size:13px;font-weight:500;cursor:pointer;outline:none;-webkit-appearance:none;transition:all var(--dur-fast) ease;}
.select-pill:focus{border-color:var(--c-accent);color:var(--c-text);}

/* ══════════════════════════════════════════════
   COMBO DROPDOWN
══════════════════════════════════════════════ */
.combo-wrap{position:relative;}
.combo-dropdown{display:none;position:absolute;top:calc(100% + 4px);left:0;right:0;background:#fff;border:1px solid rgba(0,0,0,0.15);border-radius:var(--r-md);max-height:200px;overflow-y:auto;box-shadow:0 8px 24px rgba(0,0,0,0.15);z-index:300;}
.combo-dropdown.open{display:block;}
.combo-item{padding:11px 14px;cursor:pointer;font-size:15px;border-bottom:0.5px solid rgba(0,0,0,0.07);color:var(--c-text);transition:background var(--dur-fast) ease;}
.combo-item:last-child{border-bottom:none;}
.combo-item:hover{background:rgba(94,106,210,0.06);}
.combo-item-add{color:var(--c-accent);font-style:italic;}
.combo-item-warn{color:var(--c-yellow);font-size:13px;}

/* ══════════════════════════════════════════════
   DROPDOWN (desktop ayarlar)
══════════════════════════════════════════════ */
.dropdown{position:relative;}
.drop-menu{display:none;position:absolute;top:calc(100% + 6px);right:0;background:#fff;border:1px solid rgba(0,0,0,0.12);border-radius:var(--r-md);min-width:190px;padding:6px;box-shadow:0 8px 32px rgba(0,0,0,0.15);z-index:500;}
.dropdown.open .drop-menu{display:block;}
.drop-item{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:var(--r-sm);color:var(--c-text-2);font-size:14px;font-weight:500;transition:all var(--dur-fast) ease;text-decoration:none;background:none;border:none;width:100%;cursor:pointer;}
.drop-item:hover{background:rgba(0,0,0,0.05);color:var(--c-text);text-decoration:none;}
.drop-divider{height:0.5px;background:rgba(0,0,0,0.10);margin:4px 0;}
.font-600{font-weight:600;}

/* ══════════════════════════════════════════════
   FAB BAR
══════════════════════════════════════════════ */
.fab-bar{
  position:fixed;bottom:calc(var(--tab-total) + var(--sp-3));
  left:50%;transform:translateX(-50%);
  background:rgba(30,30,30,0.90);
  border-radius:var(--r-full);box-shadow:0 4px 24px rgba(0,0,0,0.25);
  padding:8px 16px;display:flex;align-items:center;gap:var(--sp-2);
  z-index:50;white-space:nowrap;
  -webkit-backdrop-filter:var(--blur-md);backdrop-filter:var(--blur-md);
}
.fab-bar .btn{font-size:13px;}
@media(min-width:768px){.fab-bar{bottom:var(--sp-5);}}

/* ══════════════════════════════════════════════
   BULK BAR
══════════════════════════════════════════════ */
.bulk-bar{background:#fff;border:1px solid rgba(0,0,0,0.10);border-radius:var(--r-md);padding:var(--sp-3) var(--sp-4);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-3);box-shadow:0 1px 4px rgba(0,0,0,0.06);}
.bulk-sel-info{font-size:14px;font-weight:600;color:var(--c-yellow);}

/* ══════════════════════════════════════════════
   FILTER ROW
══════════════════════════════════════════════ */
.filter-row{display:flex;flex-wrap:wrap;gap:var(--sp-2);margin-bottom:var(--sp-3);align-items:center;}

/* ══════════════════════════════════════════════
   MISC UI
══════════════════════════════════════════════ */
.info-box{background:rgba(94,106,210,0.06);border:0.5px solid rgba(94,106,210,0.20);border-left:3px solid var(--c-accent);border-radius:var(--r-md);padding:12px 14px;font-size:14px;color:var(--c-text-2);line-height:1.6;margin-bottom:var(--sp-4);}
.flash{padding:12px 16px;border-radius:var(--r-md);margin-bottom:var(--sp-4);font-size:15px;display:flex;align-items:center;gap:8px;}
.flash-success{background:var(--c-green-bg);border:0.5px solid rgba(26,143,60,0.25);color:var(--c-green);}
.flash-error  {background:var(--c-red-bg);  border:0.5px solid rgba(214,48,49,0.25);color:var(--c-red);}
.ferr{background:var(--c-red-bg);border:0.5px solid rgba(214,48,49,0.25);color:var(--c-red);font-size:13px;padding:10px 12px;border-radius:var(--r-sm);}
.empty-state{display:flex;flex-direction:column;align-items:center;padding:60px 20px;text-align:center;gap:var(--sp-3);}

.empty-title{font-size:20px;font-weight:700;color:var(--c-text);}
.empty-sub{font-size:15px;color:var(--c-text-2);max-width:280px;}
.grid-empty{grid-column:1/-1;padding:48px 20px;text-align:center;color:var(--c-text-3);font-size:15px;}
.section-label{font-size:12px;font-weight:700;letter-spacing:0.8px;text-transform:uppercase;color:var(--c-text-3);margin:var(--sp-5) 0 var(--sp-3);}
.stat-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:var(--sp-3);margin-bottom:var(--sp-4);}
.stat-box{background:var(--c-surface);border:0.5px solid rgba(0,0,0,0.10);border-radius:var(--r-md);padding:var(--sp-4);text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.05);}
.stat-num{font-size:30px;font-weight:800;line-height:1;margin-bottom:4px;}
.stat-lbl{font-size:12px;color:var(--c-text-2);}
.stat-pct{font-size:13px;font-weight:600;color:var(--c-text-3);}
.prog-track{height:6px;background:rgba(0,0,0,0.08);border-radius:3px;overflow:hidden;}
.prog-fill{height:100%;border-radius:3px;background:var(--c-accent);transition:width 0.4s var(--ease-out);}
.prog-fill.green{background:var(--c-green);}
.prog-fill.yellow{background:var(--c-yellow);}
.prog-fill.red{background:var(--c-red);}

/* CİNSİYET TOGGLE */
.cin-toggle{display:flex;gap:var(--sp-2);}
.cin-btn{flex:1;padding:11px;border-radius:var(--r-md);border:1px solid rgba(0,0,0,0.15);background:#fff;color:var(--c-text-2);font-size:14px;font-weight:600;cursor:pointer;transition:all var(--dur-fast) var(--ease-spring);}
.cin-btn:active{transform:scale(0.95);}
.cin-btn.on{border-color:var(--c-accent);background:var(--c-accent-bg);color:var(--c-accent);}

/* TANM ROW */
.tanim-row{display:flex;align-items:center;gap:10px;background:#fff;border:0.5px solid rgba(0,0,0,0.10);border-radius:var(--r-sm);padding:10px 12px;font-size:13px;box-shadow:0 1px 2px rgba(0,0,0,0.04);}
.tanim-row .tr-name{flex:1;font-weight:600;color:var(--c-text);}
.tanim-row .tr-cnt{color:var(--c-text-3);font-size:11px;flex-shrink:0;}
.tanim-row .tr-acts{display:flex;gap:4px;}
.tr-btn{width:28px;height:28px;border-radius:var(--r-xs);border:0.5px solid rgba(0,0,0,0.12);background:none;color:var(--c-text-3);cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition:all var(--dur-fast) ease;}
.tr-btn:hover{background:rgba(0,0,0,0.06);color:var(--c-text);}
.tr-btn.del:hover{background:var(--c-red-bg);border-color:rgba(214,48,49,0.3);color:var(--c-red);}

/* DROP ZONE */
.drop-zone{border:2px dashed rgba(0,0,0,0.15);border-radius:var(--r-lg);padding:40px 24px;text-align:center;cursor:pointer;transition:all var(--dur-fast) ease;background:#fff;}
.drop-zone:hover,.drop-zone.drag-over{border-color:var(--c-accent);background:var(--c-accent-bg);}

/* MISC */
.gap-2{gap:var(--sp-2);}.gap-3{gap:var(--sp-3);}.gap-4{gap:var(--sp-4);}
.mt-3{margin-top:var(--sp-3);}.mt-4{margin-top:var(--sp-4);}
.mb-3{margin-bottom:var(--sp-3);}.mb-4{margin-bottom:var(--sp-4);}
.mb-2{margin-bottom:var(--sp-2);}
.text-muted{color:var(--c-text-2);}.text-muted2{color:var(--c-text-3);}

@keyframes fadeIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:none;}}
.anim-fade{animation:fadeIn var(--dur-med) var(--ease-out) both;}

/* ── Top bar SVG icons ─────────────────────── */
.top-bar-nav a svg, .top-bar-nav button svg:first-child {
  flex-shrink:0; opacity:.75;
}
.top-bar-nav a.active svg, .top-bar-nav button.active svg:first-child { opacity:1; }

/* ── D4 Durum butonları (parmak dostu) ──────── */
.d4-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px; width: 100%;
  margin-top: 4px;
}
.d4-btn {
  border: 1.5px solid rgba(0,0,0,0.10);
  border-radius: 10px;
  padding: 9px 4px;
  font-size: 12px; font-weight: 700;
  cursor: pointer;
  background: #f5f5f5; color: #888;
  transition: all 0.15s;
  line-height: 1.3; text-align: center;
  min-height: 44px; /* Apple HIG minimum touch target */
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  gap: 2px;
}
.d4-btn:active { transform: scale(0.92); }
.d4-btn.d-notr     { background:#f5f5f5; color:#999; border-color:rgba(0,0,0,.10); }
.d4-btn.d-olumlu   { background:rgba(26,143,60,0.10); color:#1a7f35; border-color:rgba(26,143,60,0.4); }
.d4-btn.d-basarili { background:rgba(192,120,0,0.12); color:#a06000; border-color:rgba(192,120,0,0.4); }
.d4-btn.d-olumsuz  { background:rgba(214,48,49,0.10); color:#c02020; border-color:rgba(214,48,49,0.4); }

/* ── Person card main (fırsat detay) ──────── */
.mc {
  background:#fff; border:1.5px solid rgba(0,0,0,0.10);
  border-radius:16px; padding:14px 10px 10px;
  display:flex; flex-direction:column; align-items:center; gap:5px;
  box-shadow:0 1px 4px rgba(0,0,0,0.06);
}
.mc.notr     { border-color:rgba(0,0,0,0.10); background:#fff; }
.mc.olumlu   { border-color:rgba(26,143,60,0.45); background:rgba(26,143,60,0.04); }
.mc.basarili { border-color:rgba(192,120,0,0.45); background:rgba(192,120,0,0.04); }
.mc.olumsuz  { border-color:rgba(214,48,49,0.40); background:rgba(214,48,49,0.04); }
.mc .mc-av {
  width:46px; height:46px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:17px; font-weight:800;
  background:rgba(94,106,210,0.12); color:#4a54b8;
}
.mc.olumlu   .mc-av { background:rgba(26,143,60,0.15); color:#1a7f35; }
.mc.basarili .mc-av { background:rgba(192,120,0,0.15); color:#a06000; }
.mc.olumsuz  .mc-av { background:rgba(214,48,49,0.12); color:#c02020; }
.mc .mc-name { font-size:12px; font-weight:600; text-align:center; line-height:1.3; color:#1a1a1a; word-break:break-word; }
.mc .mc-sub  { font-size:10px; color:#888; text-align:center; }