:root{
  /* sakin ve ferah palet */
  --bg:#f3f8ff;
  --card:#ffffff;
  --text:#0f172a;
  --muted:#5b6b7f;
  --line:#d7e8f5;

  --brand:#34c6d3;   /* yumuşak turkuaz */
  --brand2:#2aa7c9;  /* daha koyu ton */
  --accent:#eef9fb;  /* kart içi nazik vurgu */

  --shadow: 0 10px 30px rgba(2, 42, 74, .06);
  --radius:16px;
  --surface:#ffffff;
}

:root[data-theme="dark"]{
  --bg:#0b1220;
  --card:rgba(15,23,42,.86);
  --text:#e5e7eb;
  --muted:#9aa7bb;
  --line:rgba(148,163,184,.22);

  --brand:#2bd4e0;
  --brand2:#28b6d6;
  --accent:rgba(43,212,224,.10);

  --shadow: 0 18px 50px rgba(0,0,0,.35);
  --surface:rgba(255,255,255,.04);
}

.surface{ background: var(--surface); }

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  background: radial-gradient(1200px 500px at 50% 0%, rgba(52,198,211,.16), transparent 65%),
              var(--bg);
  color:var(--text);
  line-height:1.55;
}

:root[data-theme="dark"] body{
  background: radial-gradient(1200px 500px at 50% 0%, rgba(43,212,224,.10), transparent 65%),
              var(--bg);
}

a{color:var(--brand2); text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1080px; margin:0 auto; padding:18px}

.site-header{
  background:rgba(255,255,255,.86);
  border-bottom:1px solid var(--line);
  position:sticky;
  top:0;
  z-index:30;
  backdrop-filter: blur(10px);
}
:root[data-theme="dark"] .site-header{ background: rgba(15,23,42,.68); }

.header-row{display:flex; align-items:center; justify-content:space-between; gap:14px}
.brand{display:flex; flex-direction:column; gap:2px}
.brand-link{color:var(--text); font-weight:850; font-size:18px; letter-spacing:.2px}
.brand-sub{color:var(--muted); font-size:12px}

.nav{display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:flex-end}
.nav a{padding:6px 8px; border-radius:10px}
.nav a:hover{background:rgba(52,198,211,.10); text-decoration:none}
:root[data-theme="dark"] .nav a:hover{ background: rgba(43,212,224,.10); }

.sep{color:rgba(15,23,42,.35)}
:root[data-theme="dark"] .sep{ color: rgba(148,163,184,.45); }

main.container{padding-top:20px; padding-bottom:34px}

hr{border:0; border-top:1px solid var(--line); margin:20px 0;}

h1,h2,h3{line-height:1.2}
h1{font-size:30px; margin:0 0 10px 0}
h2{font-size:20px; margin:0 0 10px 0}
h3{font-size:16px; margin:0 0 8px 0}

.muted{color:var(--muted)}
.small{font-size:13px}
.kicker{color:var(--muted); font-size:13px}

.card{
  background:var(--card);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:16px;
  box-shadow: var(--shadow);
}
.card.soft{ background: linear-gradient(180deg, rgba(52,198,211,.10), rgba(255,255,255,1)); }
:root[data-theme="dark"] .card.soft{ background: linear-gradient(180deg, rgba(43,212,224,.10), rgba(15,23,42,.86)); }
.card.flat{box-shadow:none}

.grid{display:grid; gap:14px}
.grid-2{grid-template-columns:repeat(2, minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3, minmax(0,1fr))}
@media (max-width: 860px){
  .header-row{flex-direction:column; align-items:flex-start}
  .grid-2,.grid-3{grid-template-columns:1fr}
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:12px;
  border:1px solid transparent;
  font-weight:700;
  cursor:pointer;
}
.btn-primary{
  color:#fff;
  background: linear-gradient(180deg, var(--brand), var(--brand2));
  box-shadow: 0 10px 24px rgba(42,167,201,.20);
}
.btn-primary:hover{filter:brightness(.98); text-decoration:none}
.btn-ghost{
  background:transparent;
  border-color:var(--line);
  color:var(--brand2);
}
.btn-ghost:hover{background:rgba(52,198,211,.08); text-decoration:none}
:root[data-theme="dark"] .btn-ghost{ background: rgba(255,255,255,.04); }

input, select, textarea{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.9);
  color:var(--text);
}
:root[data-theme="dark"] input, :root[data-theme="dark"] select, :root[data-theme="dark"] textarea{
  background: rgba(2,6,23,.35);
}
input:focus, select:focus, textarea:focus{
  outline:2px solid rgba(52,198,211,.18);
  border-color: rgba(42,167,201,.65);
}

.section-head{display:flex; justify-content:space-between; align-items:end; gap:12px; flex-wrap:wrap;}
.section-head a{font-weight:700}

.table-wrap{overflow:auto; border-radius:16px; border:1px solid var(--line); background:rgba(255,255,255,.85)}
:root[data-theme="dark"] .table-wrap{ background: rgba(2,6,23,.25); }
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
.table th{font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); font-weight:900; background:rgba(255,255,255,.6)}
:root[data-theme="dark"] .table th{ background: rgba(255,255,255,.05); }
.table tr:last-child td{border-bottom:none}

.pill{display:inline-flex; padding:4px 10px; border:1px solid var(--line); border-radius:999px; background:rgba(255,255,255,.8); color:var(--muted); font-size:12px; font-weight:900}
:root[data-theme="dark"] .pill{ background: rgba(255,255,255,.05); }

/* theme toggle */
.theme-toggle{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border:1px solid var(--line);
  border-radius:999px;
  background: rgba(255,255,255,.7);
  color: var(--muted);
  font-weight:800;
}
:root[data-theme="dark"] .theme-toggle{ background: rgba(255,255,255,.04); }
.theme-toggle svg{ width:16px; height:16px; }

/* consent (KVKK) */
.consent-card{
  border:1px solid var(--line);
  border-radius:16px;
  background: linear-gradient(180deg, rgba(52,198,211,.10), rgba(255,255,255,1));
  padding:12px;
}
:root[data-theme="dark"] .consent-card{ background: linear-gradient(180deg, rgba(43,212,224,.10), rgba(15,23,42,.86)); }

.consent-check{display:flex; gap:12px; align-items:flex-start; cursor:pointer; user-select:none;}
.consent-check input{position:absolute; opacity:0; pointer-events:none;}

.consent-ui{
  width:22px; height:22px;
  border-radius:8px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.85);
  display:flex; align-items:center; justify-content:center;
  box-shadow: 0 8px 20px rgba(2,42,74,.06);
  flex: 0 0 22px;
  margin-top:2px;
}
:root[data-theme="dark"] .consent-ui{ background: rgba(255,255,255,.04); }

.consent-tick{
  width:10px; height:6px;
  border-left:3px solid transparent;
  border-bottom:3px solid transparent;
  transform: rotate(-45deg) translateY(-1px);
  opacity:0;
}

.consent-check input:checked + .consent-ui{
  border-color: rgba(42,167,201,.65);
  background: rgba(52,198,211,.18);
}
.consent-check input:checked + .consent-ui .consent-tick{
  border-left-color: var(--brand2);
  border-bottom-color: var(--brand2);
  opacity:1;
}

.consent-text{display:block; color: var(--text);}
.consent-sub{display:block; margin-top:6px; color:var(--muted); font-size:13px;}

/* badges */
.badges{display:flex; gap:8px; flex-wrap:wrap; margin-top:12px}
.badge{
  border:1px solid var(--line);
  background: var(--surface);
  border-radius:999px;
  padding:5px 10px;
  color:var(--muted);
  font-size:13px;
  font-weight:800;
}

/* section head */
.section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:12px;
  flex-wrap:wrap;
}
.section-head a{font-weight:800}

/* quote */
.quote{position:relative; padding-left:14px;}
.quote:before{
  content:"“";
  position:absolute;
  left:-2px;
  top:-6px;
  font-size:32px;
  color:rgba(42,167,201,.35);
  font-weight:900;
}
:root[data-theme="dark"] .quote:before{ color: rgba(43,212,224,.22); }

/* posts */
.post-card{overflow:hidden; padding:0;}
.post-thumb{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  border-bottom:1px solid var(--line);
  background: var(--accent);
}
.post-body{padding:14px 14px 16px 14px}
.post-title{color:var(--text); font-weight:900; font-size:16px; display:inline-block;}
.post-title:hover{text-decoration:none; opacity:.96;}
.post-meta{margin-top:6px; color:var(--muted); font-size:13px}

/* testimonial card (theme-safe) */
.testimonial-card{
  background: linear-gradient(180deg, rgba(52,198,211,.12), var(--surface));
}

/* footer */
.site-footer{
  border-top:1px solid var(--line);
  background: var(--surface);
}
:root[data-theme="dark"] .site-footer{ background: rgba(15,23,42,.72); }
.footer-grid{display:grid; grid-template-columns: 1.2fr 1fr 1fr; gap:18px;}
.footer-title{font-weight:900; margin-bottom:10px}
.footer-links{display:flex; flex-direction:column; gap:8px}
@media (max-width: 860px){
  .footer-grid{grid-template-columns:1fr}
}

/* error page */
.error-wrap{ padding: 18px 0 28px 0; }
.error-shell{ max-width: 860px; margin: 0 auto; }
.error-head{display:flex; align-items:center; justify-content:space-between; gap:14px; margin: 8px 0 12px 0;}
.error-badge{display:flex; align-items:baseline; gap:10px; padding:10px 14px; border:1px solid var(--line); border-radius:16px; background: rgba(255,255,255,.75);}
:root[data-theme="dark"] .error-badge{ background: rgba(255,255,255,.04); }
.error-badge__code{ font-weight:900; font-size:26px; line-height:1; color: var(--text); }
.error-badge__text{ color: var(--muted); font-size:13px; }

.error-icon{width:48px; height:48px; border-radius:16px; border:1px solid var(--line);
  background: linear-gradient(180deg, rgba(56,189,248,.18), rgba(255,255,255,1));
  display:flex; align-items:center; justify-content:center; color: var(--brand2);
}
:root[data-theme="dark"] .error-icon{ background: linear-gradient(180deg, rgba(43,212,224,.10), rgba(15,23,42,.86)); }
.error-icon svg{ width:26px; height:26px; }

.error-card{background: linear-gradient(180deg, rgba(56,189,248,.12), rgba(255,255,255,1)); border:1px solid var(--line); border-radius:18px; padding:18px;}
:root[data-theme="dark"] .error-card{ background: linear-gradient(180deg, rgba(43,212,224,.08), rgba(15,23,42,.86)); }
.error-title{ margin:0 0 6px 0; font-size:22px; letter-spacing:-0.2px; }
.error-msg{ margin:0; color: var(--muted); max-width:72ch; }

.error-hint{margin-top:12px; display:flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--line); border-radius:14px; background: rgba(255,255,255,.7); color: var(--muted); font-size:13px;}
:root[data-theme="dark"] .error-hint{ background: rgba(255,255,255,.04); }
.error-hint .dot{ width:8px; height:8px; border-radius:999px; background: rgba(14,165,233,.55); }

.error-actions{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

.error-search{ margin-top:16px; padding-top:14px; border-top:1px solid var(--line); }
.error-search form{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.error-search input{ min-width:260px; }
.error-footer{ margin-top:12px; font-size:13px; text-align:center; }

.devbox{margin-top:16px; padding-top:14px; border-top:1px solid var(--line);}
.devbox summary{ cursor:pointer; }
.devrow{ margin-top:10px; }
.devlabel{ font-weight:900; font-size:13px; margin-bottom:6px; }
.devpre{margin:0; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background: var(--surface);
  color: var(--text); overflow:auto; white-space:pre-wrap; word-break:break-word; font-size:12px; line-height:1.45;
}
:root[data-theme="dark"] .devpre{ background: rgba(255,255,255,.04); }

@media (max-width: 640px){
  .error-head{ align-items:flex-start; }
  .error-icon{ width:42px; height:42px; border-radius:14px; }
  .error-search input{ min-width:100%; }
}

/* table */
.table-wrap{overflow:auto; border-radius:16px; border:1px solid var(--line); background: var(--surface)}
:root[data-theme="dark"] .table-wrap{ background: rgba(255,255,255,.02); }
.table{width:100%; border-collapse:collapse}
.table th,.table td{padding:10px 12px; border-bottom:1px solid var(--line); vertical-align:top}
.table th{font-size:12px; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); font-weight:900; background:rgba(255,255,255,.6)}
:root[data-theme="dark"] .table th{ background: rgba(255,255,255,.03); }
.table tr:last-child td{border-bottom:none}

/* pill */
.pill{display:inline-flex; padding:4px 10px; border:1px solid var(--line); border-radius:999px; background: var(--surface); color:var(--muted); font-size:12px; font-weight:900}

/* about -> profile photo */
.profile-photo{
  width:100%;
  max-height:340px;
  object-fit:cover;
  border-radius:18px;
  border:1px solid var(--line);
  background: var(--surface);
  box-shadow: var(--shadow);
  margin-bottom:12px;
}

.photo-frame{
  width:140px;
  height:140px;
  border-radius:22px;
  border:1px solid var(--line);
  background: var(--surface);
  overflow:hidden;
  box-shadow: var(--shadow);
}
.photo-frame img{ width:100%; height:100%; object-fit:cover; display:block; }

.action-row{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  margin-top:12px;
}

.action-row form{
  display:flex;
  gap:8px;
  align-items:center;
}

.action-row input{
  width:220px;
  max-width:100%;
}

/* ===== premium page head ===== */
.page-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin: 6px 0 14px 0;
}
.page-title{ margin:0; font-size:28px; letter-spacing:-.2px; }
.page-sub{ margin:6px 0 0 0; color: var(--muted); }
.page-actions{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }

/* ===== card head ===== */
.card-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-bottom: 12px;
}
.card-title{ margin:0; font-size:18px; font-weight:900; letter-spacing:-.1px; }
.pill-group{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }

/* ===== info grid (patient details) ===== */
.info-grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap:10px;
}
@media (max-width: 860px){
  .info-grid{ grid-template-columns: 1fr; }
}
.info-item{
  border:1px solid var(--line);
  border-radius:16px;
  padding:12px;
  background: rgba(255,255,255,.72);
}
html[data-theme="dark"] .info-item{
  background: rgba(15,23,42,.28);
}
.info-k{
  font-size:12px;
  letter-spacing:.6px;
  text-transform:uppercase;
  color: var(--muted);
  font-weight:900;
  margin-bottom:6px;
}
.info-v{
  font-weight:850;
  color: var(--text);
  overflow-wrap:anywhere;
}
.info-v a{ font-weight:850; }

/* ===== nicer details summary ===== */
.details-sum{
  cursor:pointer;
  font-weight:900;
  list-style:none;
}
.details-sum::-webkit-details-marker{ display:none; }

/* ===== premium checkbox ===== */
.checkline{
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  user-select:none;
  color: var(--muted);
  font-size:13px;
  font-weight:800;
}
.checkline input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.checkui{
  width:18px;
  height:18px;
  border-radius:7px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.8);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-shadow: 0 10px 20px rgba(2,42,74,.08);
}
html[data-theme="dark"] .checkui{
  background: rgba(15,23,42,.35);
}
.checkui:after{
  content:"";
  width:10px;
  height:10px;
  border-radius:4px;
  transform: scale(.2);
  opacity:0;
  transition: .14s ease;
  background: linear-gradient(180deg, var(--brand), var(--brand2));
}
.checkline input:checked + .checkui:after{
  transform: scale(1);
  opacity:1;
}
.checkline input:focus + .checkui{
  outline:2px solid rgba(52,198,211,.22);
  border-color: rgba(42,167,201,.65);
}

/* ===== empty / alert premium (if not already) ===== */
.empty{
  border:1px dashed var(--line);
  border-radius:16px;
  padding:12px;
  color: var(--muted);
  background: rgba(255,255,255,.6);
}
html[data-theme="dark"] .empty{
  background: rgba(15,23,42,.22);
}
.alert{
  border-radius:16px;
  padding:10px 12px;
  border:1px solid var(--line);
  margin-bottom:12px;
  background: rgba(255,255,255,.75);
}
.alert.ok{ border-color: rgba(14,165,233,.35); }
.alert.err{ border-color: rgba(180,83,9,.45); }
html[data-theme="dark"] .alert{
  background: rgba(15,23,42,.22);
}

/* --- notes premium --- */
.note-form-actions{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top:10px;
}

.note-list{
  display:flex;
  flex-direction:column;
  gap:12px;
}

.note-card{
  border:1px solid var(--line);
  border-radius:16px;
  padding:14px;
  background: var(--surface);
  box-shadow: var(--shadow-soft);
}

.note-card.is-pinned{
  border-color: rgba(56,189,248,.45);
  box-shadow: 0 0 0 1px rgba(56,189,248,.10), var(--shadow-soft);
}

.note-top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-bottom:10px;
  border-bottom:1px dashed var(--line);
}

.note-actions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
}

.note-body{
  padding-top:12px;
  line-height:1.55;
  white-space:pre-wrap;
  word-break:break-word;
}

/* Düzenle summary'yi buton gibi yap */
.note-edit{
  margin-top:12px;
}

.details-sum{
  list-style:none;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  background: var(--surface2);
  font-weight:800;
}

.details-sum::-webkit-details-marker{ display:none; }

.note-edit[open] .details-sum{
  box-shadow: 0 0 0 1px rgba(56,189,248,.12);
  border-color: rgba(56,189,248,.35);
}

.note-edit-actions{
  display:flex;
  justify-content:flex-end;
  margin-top:10px;
}

/* checkbox premium */
.checkline{
  display:inline-flex;
  align-items:center;
  gap:10px;
  user-select:none;
  cursor:pointer;
  font-weight:700;
  color: var(--muted);
}

.checkline input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.checkui{
  width:18px;
  height:18px;
  border-radius:6px;
  border:1px solid var(--line);
  background: var(--surface2);
  display:inline-block;
  position:relative;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.checkline input:checked + .checkui{
  border-color: rgba(56,189,248,.55);
  box-shadow: 0 0 0 3px rgba(56,189,248,.12);
}

.checkline input:checked + .checkui:after{
  content:"";
  position:absolute;
  left:5px;
  top:2px;
  width:6px;
  height:10px;
  border-right:2px solid var(--brand2);
  border-bottom:2px solid var(--brand2);
  transform:rotate(45deg);
}