/* Atatürk Köşesi – Öğretmen Dosyası sihirbazı — sınıf öneki: akb- */
.akb { --ink:#14263a; --muted:#5d6f80; --line:#dbe4ec; --soft:#f4f8fb; --accent:#3a86ff; --accent-dark:#1f63d6; --red:#c8102e;
  max-width:1240px; margin:24px auto 72px; padding:0 16px; color:var(--ink); }
.akb *, .akb *::before, .akb *::after { box-sizing:border-box; }
.akb [hidden] { display:none !important; }
.akb-head { margin-bottom:16px; }
.akb-kicker { margin:0 0 6px; font-size:11px; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--accent-dark); }
.akb-head h1 { margin:0 0 6px; font-size:clamp(22px,3vw,32px); line-height:1.15; font-weight:800; letter-spacing:-.5px; }
.akb-head p { margin:0; font-size:14px; color:var(--muted); line-height:1.55; }
.akb-facts { display:flex; flex-wrap:wrap; gap:8px; list-style:none; padding:0; margin:12px 0 0; }
.akb-facts li { display:inline-flex; align-items:center; gap:7px; padding:6px 11px; border-radius:999px; background:#eef4fb; color:#264766; font-size:12px; font-weight:700; }
.akb-facts i { color:var(--red); }
.akb-alert { padding:11px 14px; border-radius:10px; font-size:13px; line-height:1.5; margin:0 0 14px; border:1px solid; }
.akb-alert.err { background:#fff1f0; border-color:#f3c4bd; color:#912b1f; }
.akb-alert.warn { background:#fff8e6; border-color:#f0d39a; color:#6d4a07; }
.akb-frame { border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow:0 14px 44px rgba(19,55,82,.07); overflow:hidden; }
.akb-body { padding:24px 28px 22px; min-width:0; }
.akb-panel-head { margin-bottom:18px; }
.akb-panel-head small { display:block; font-size:11px; font-weight:800; letter-spacing:1px; text-transform:uppercase; color:var(--accent-dark); margin-bottom:5px; }
.akb-panel-head h2 { margin:0 0 5px; font-size:22px; font-weight:800; letter-spacing:-.3px; }
.akb-panel-head p { margin:0; font-size:13.5px; color:var(--muted); line-height:1.55; }

.akb-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(178px,1fr)); gap:14px; }
.akb-card { position:relative; display:flex; flex-direction:column; gap:6px; padding:12px; border:1.5px solid var(--line); border-radius:14px; background:#fff; font:inherit; text-align:left; color:var(--ink); cursor:pointer; transition:border-color .15s, box-shadow .15s, transform .15s; }
.akb-card:hover { border-color:#9cc0f5; transform:translateY(-1px); }
.akb-card[aria-checked="true"] { border-color:var(--accent); box-shadow:0 0 0 3px rgba(58,134,255,.18); }
.akb-card:focus-visible, .akb-btn:focus-visible { outline:3px solid rgba(58,134,255,.45); outline-offset:2px; }
.akb-mini { position:relative; display:block; width:100%; aspect-ratio:210/297; border:1px solid #e3e8ee; border-radius:4px; overflow:hidden; box-shadow:0 2px 8px rgba(20,38,58,.08); }
.akb-mini-bar { position:absolute; left:12%; right:8%; top:5%; height:2px; }
.akb-mini-photo { position:absolute; top:18%; width:56%; aspect-ratio:4/5; overflow:hidden; background:#eee; }
.akb-mini-photo--center { left:22%; }
.akb-mini-photo--left { left:12%; }
.akb-mini-photo img { display:block; width:100%; height:100%; max-width:none; object-fit:cover; }
.akb-mini-cap { position:absolute; top:76%; font-size:9px; font-weight:600; white-space:nowrap; }
.akb-mini-cap--center { left:0; right:0; text-align:center; }
.akb-mini-cap--left { left:12%; }
.akb-card-name { font-size:14px; font-weight:800; }
.akb-card-sum { font-size:12px; line-height:1.45; color:var(--muted); }
.akb-card-check { position:absolute; top:8px; right:8px; display:none; width:24px; height:24px; border-radius:50%; background:var(--accent); color:#fff; font-size:12px; align-items:center; justify-content:center; }
.akb-card[aria-checked="true"] .akb-card-check { display:inline-flex; }

.akb-pages { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.akb-page { margin:0; min-width:0; }
.akb-page-frame { position:relative; width:100%; aspect-ratio:210/297; overflow:hidden; border:1px solid #d5dde6; border-radius:4px; background:#fff; box-shadow:0 4px 14px rgba(20,38,58,.08); }
/* Sitenin genel img/iframe max-width:100% kuralı ölçeklemeyi bozmasın. */
.akb-page-frame iframe { position:absolute; left:0; top:0; width:794px; height:1123px; max-width:none !important; border:0; transform-origin:0 0; pointer-events:none; background:#fff; }
.akb-page figcaption { margin-top:7px; font-size:12px; font-weight:700; color:var(--muted); text-align:center; }
.akb-status { min-height:20px; margin:12px 0; font-size:12.5px; color:var(--muted); }
.akb-order { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; list-style:none; padding:0; margin:0 0 18px; }
.akb-order li { display:flex; align-items:center; gap:9px; padding:11px 12px; border:1px solid var(--line); border-radius:10px; background:var(--soft); font-size:13px; font-weight:700; }
.akb-order span { display:inline-flex; width:24px; height:24px; border-radius:50%; align-items:center; justify-content:center; background:var(--red); color:#fff; font-size:12px; }
.akb-guest { display:flex; flex-wrap:wrap; gap:10px; }
.akb-note { margin:14px 0 0; font-size:12px; line-height:1.55; color:var(--muted); }

.akb-btn { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:40px; padding:9px 15px; border-radius:10px; border:1px solid #c6d6e6; background:#fff; color:#1d4f86; font:inherit; font-size:13px; font-weight:800; cursor:pointer; text-decoration:none; white-space:nowrap; }
.akb-btn:hover { border-color:var(--accent); }
.akb-btn.primary { background:var(--accent); border-color:var(--accent); color:#fff; }
.akb-btn.primary:hover { background:var(--accent-dark); }
.akb-btn.lg { min-height:52px; padding:12px 22px; font-size:15px; border-radius:12px; }
.akb-btn:disabled { opacity:.55; cursor:not-allowed; }
.akb-nav { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:22px; padding-top:16px; border-top:1px solid var(--line); }
.akb-counter { font-size:12.5px; color:var(--muted); }

@media (max-width:900px) { .akb-pages, .akb-order { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px) { .akb-body { padding:18px 14px; } .akb-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .akb-card-sum { display:none; } .akb-btn.lg { width:100%; white-space:normal; } }