:root{
    /* sabit marka tonları — temadan etkilenmez */
    --amber:#FFB627;
    --amber-deep:#D98D0E;
    --teal:#4FA69A;
    --red:#E5555C;
    --ink-on-accent:#14181F;

    /* tema tonları — dark varsayılan (JS attribute ile geçersiz kılınır) */
    --bg:#12161D;
    --surface:#1A2029;
    --surface-2:#212938;
    --ink:#EEEAE0;
    --ink-dim:#93A0AF;
    --line: rgba(238,234,224,0.10);
    --line-strong: rgba(238,234,224,0.18);
    --amber-text:#FFB627;
    --teal-text:#4FA69A;
    --red-text:#E5555C;
    --header-bg: rgba(18,22,29,0.86);
    --hover-tint: rgba(238,234,224,0.06);
  }
  :root[data-theme="light"]{
    --bg:#F1F3F6;
    --surface:#FFFFFF;
    --surface-2:#E8ECF1;
    --ink:#171B22;
    --ink-dim:#5B6472;
    --line: rgba(23,27,34,0.09);
    --line-strong: rgba(23,27,34,0.16);
    --amber-text:#9A5B0A;
    --teal-text:#1F7A6E;
    --red-text:#C4333B;
    --header-bg: rgba(255,255,255,0.82);
    --hover-tint: rgba(23,27,34,0.05);
  }
  body{
    transition: background-color .25s ease, color .25s ease;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  /* "hidden" özniteliği her zaman kazansın: yazarın yazdığı bir display
     kuralı, tarayıcının hidden için verdiği display:none değerini ezer
     ve gizlenmesi gereken katman ekranda kalır (bkz. kiosk.css'teki
     ayrıntılı not). */
  [hidden]{ display:none !important; }
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--ink);
    font-family:'IBM Plex Sans', system-ui, sans-serif;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
  }
  a{color:inherit; text-decoration:none;}
  img,svg{display:block;}
  .wrap{max-width:1240px; margin:0 auto; padding:0 32px;}
  .eyebrow{
    font-family:'IBM Plex Mono', monospace;
    font-size:12px;
    letter-spacing:.14em;
    text-transform:uppercase;
    color:var(--amber-text);
    display:flex; align-items:center; gap:8px;
  }
  .eyebrow::before{
    content:"";
    width:7px; height:7px; border-radius:50%;
    background:var(--amber);
    box-shadow:0 0 0 3px rgba(255,182,39,0.18);
  }
  .eyebrow.red{ color:var(--red-text); }
  .eyebrow.red::before{ background:var(--red); box-shadow:0 0 0 3px rgba(229,85,92,0.2);}

  /* ===== Header ===== */
  header{
    position:sticky; top:0; z-index:50;
    background:var(--header-bg);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .nav{
    display:flex; align-items:center; justify-content:space-between;
    height:76px;
  }
  .logo{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800;
    font-size:28px;
    letter-spacing:.02em;
    display:flex; align-items:center; gap:10px;
  }
  .logo .dot{
    width:10px; height:22px;
    background:var(--amber);
    border-radius:2px;
    display:inline-block;
  }
  .nav-links{
    display:flex; gap:6px;
    font-size:14px; font-weight:500;
    color:var(--ink-dim);
  }
  .nav-item{ position:relative; }
  .nav-item > .nav-trigger{
    display:flex; align-items:center; gap:6px;
    padding:10px 12px;
    background:none; border:none;
    font-family:'IBM Plex Sans', sans-serif;
    font-size:14px; font-weight:500;
    color:var(--ink-dim);
    cursor:pointer;
    border-radius:4px;
    transition:color .2s, background .2s;
  }
  .nav-item > .nav-trigger:hover,
  .nav-item.open > .nav-trigger{ color:var(--ink); background:var(--hover-tint); }
  .nav-trigger .chev{
    width:9px; height:9px;
    transition:transform .2s ease;
  }
  .nav-item.open .chev,
  .nav-item:hover .chev{ transform:rotate(180deg); }

  .dropdown{
    position:absolute;
    top:calc(100% + 8px);
    left:0;
    min-width:230px;
    max-width:340px;
    max-height:min(70vh, 480px);
    overflow-y:auto;
    background:var(--surface);
    border:1px solid var(--line-strong);
    border-radius:8px;
    padding:8px;
    box-shadow:0 20px 40px -16px rgba(0,0,0,0.55);
    opacity:0;
    visibility:hidden;
    transform:translateY(-6px);
    transition:opacity .18s ease, transform .18s ease, visibility .18s;
    z-index:60;
  }
  .nav-item:hover .dropdown,
  .nav-item.open .dropdown{
    opacity:1; visibility:visible; transform:translateY(0);
  }
  .dropdown a{
    display:flex; align-items:center; justify-content:space-between;
    gap:10px;
    padding:9px 10px;
    font-size:13.5px; font-weight:500;
    line-height:1.35;
    color:var(--ink);
    border-radius:5px;
    transition:background .15s, color .15s;
  }
  .dropdown a img{ max-height:28px; width:auto; margin:2px 0; }
  .dropdown a:hover{ background:rgba(255,182,39,0.10); color:var(--amber-text); }
  .dropdown a .tag-mini{
    font-family:'IBM Plex Mono', monospace;
    font-size:9.5px; color:var(--ink-dim);
    border:1px solid var(--line-strong);
    padding:1px 5px; border-radius:3px;
  }

  /* ===== 3. seviye: alt menü (ör. Birliklerimiz > Demir > Hakkında) ===== */
  .dropdown-item{ position:relative; }
  .dropdown-item.has-submenu > .dropdown-trigger{
    width:100%;
    display:flex; align-items:center; justify-content:space-between;
    gap:10px;
    padding:9px 10px;
    font-size:13.5px; font-weight:500;
    line-height:1.35;
    color:var(--ink);
    background:none; border:none;
    border-radius:5px;
    cursor:pointer;
    text-align:left;
    font-family:inherit;
    transition:background .15s, color .15s;
  }
  .dropdown-item.has-submenu > .dropdown-trigger:hover,
  .dropdown-item.has-submenu.open > .dropdown-trigger{ background:rgba(255,182,39,0.10); color:var(--amber-text); }
  .subchev{ width:8px; height:8px; flex-shrink:0; transition:transform .2s ease; transform:rotate(-90deg); }
  .dropdown-item.has-submenu.open .subchev{ transform:rotate(0deg); }

  .submenu{
    position:absolute;
    top:0; left:100%;
    margin-left:6px;
    min-width:220px;
    background:var(--surface);
    border:1px solid var(--line-strong);
    border-radius:8px;
    padding:8px;
    box-shadow:0 20px 40px -16px rgba(0,0,0,0.55);
    opacity:0; visibility:hidden;
    transform:translateX(-6px);
    transition:opacity .15s ease, transform .15s ease, visibility .15s;
    z-index:70;
  }
  .dropdown-item.has-submenu.open .submenu{
    opacity:1; visibility:visible; transform:translateX(0);
  }
  .submenu a{
    display:block;
    padding:8px 10px;
    font-size:13px;
    color:var(--ink);
    border-radius:5px;
    transition:background .15s, color .15s;
  }
  .submenu a:hover{ background:rgba(255,182,39,0.10); color:var(--amber-text); }

  @media(max-width:920px){
    .submenu{
      position:static;
      margin-left:0;
      min-width:0;
      opacity:1; visibility:visible; transform:none;
      box-shadow:none; border:none; background:transparent;
      max-height:0; overflow:hidden;
      padding:0 0 0 14px;
      transition:max-height .25s ease, padding .25s ease;
    }
    .dropdown-item.has-submenu.open .submenu{ max-height:600px; padding:4px 0 8px 14px; }
  }

  /* Alt menü içeren dropdown'da, yandan açılan flyout'un kırpılmaması için
     SADECE masaüstünde taşma kısıtlamasını kaldırıyoruz — mobilde akordeon
     kapanma davranışı (.dropdown{max-height:0}) olduğu gibi kalmalı. */
  @media(min-width:921px){
    .dropdown.dropdown--nested{ overflow:visible; max-height:none; }
  }

  .nav-right{ display:flex; align-items:center; gap:16px; }
  .theme-toggle{
    width:38px; height:38px;
    border-radius:50%;
    border:1px solid var(--line-strong);
    background:transparent;
    color:var(--ink);
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
    transition:border-color .2s ease, color .2s ease, background .2s ease;
    flex-shrink:0;
  }
  .theme-toggle:hover{ border-color:var(--amber); color:var(--amber-text); }
  .theme-toggle svg{ width:17px; height:17px; }
  .theme-toggle .icon-moon{ display:none; }
  :root[data-theme="light"] .theme-toggle .icon-sun{ display:none; }
  :root[data-theme="light"] .theme-toggle .icon-moon{ display:block; }
  .btn{
    font-family:'IBM Plex Sans', sans-serif;
    font-weight:600; font-size:13.5px;
    padding:10px 20px;
    border-radius:3px;
    border:1px solid var(--amber);
    color:var(--ink-on-accent);
    background:var(--amber);
    cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease;
    white-space:nowrap;
  }
  .btn:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(255,182,39,0.25);}
  .btn.ghost{
    background:transparent; color:var(--ink); border-color:var(--line-strong);
  }
  .btn.ghost:hover{ border-color:var(--amber); box-shadow:none; }

  .mobile-nav-toggle{
    display:none;
    width:38px; height:38px;
    align-items:center; justify-content:center;
    border:1px solid var(--line-strong);
    border-radius:8px;
    background:transparent;
    color:var(--ink);
    cursor:pointer;
    flex-shrink:0;
    position:relative;
    z-index:210;
  }
  .mobile-nav-toggle:hover{ border-color:var(--amber); color:var(--amber-text); }
  .mobile-nav-toggle .icon-close{ display:none; }
  .mobile-nav-toggle[aria-expanded="true"] .icon-burger{ display:none; }
  .mobile-nav-toggle[aria-expanded="true"] .icon-close{ display:block; }

  .mobile-nav-backdrop{
    display:none;
    position:fixed; top:0; right:0; bottom:0; left:0;
    background:rgba(0,0,0,0.55);
    z-index:190;
  }
  .mobile-nav-backdrop.active{ display:block; }

  @media(max-width:920px){
    .mobile-nav-toggle{ display:flex; }
    .nav-links{
      display:flex;
      flex-direction:column;
      align-items:stretch;
      gap:2px;
      position:fixed;
      top:0; right:-320px;
      width:300px; max-width:85vw;
      height:100vh;
      background:var(--surface);
      padding:84px 14px 24px;
      overflow-y:auto;
      box-shadow:-24px 0 48px -20px rgba(0,0,0,0.5);
      transition:right .3s ease;
      z-index:200;
    }
    .nav-links.mobile-open{ right:0; }
    .nav-item{ width:100%; }
    .nav-item > .nav-trigger{ width:100%; justify-content:space-between; padding:12px; }
    .dropdown{
      position:static;
      min-width:0; max-width:none;
      opacity:1; visibility:visible; transform:none;
      box-shadow:none;
      border:none;
      background:transparent;
      max-height:0;
      overflow:hidden;
      padding:0 8px;
      transition:max-height .25s ease, padding .25s ease;
    }
    .nav-item.open .dropdown{ max-height:1200px; padding:4px 8px 10px; }
    .dropdown a{ padding:10px 10px; }
  }

  /* ===== Carousel: son 5 haber ===== */
  .carousel-section{
    padding:32px 0 0;
    border-bottom:1px solid var(--line);
  }
  .carousel-head{
    display:flex; align-items:center; justify-content:space-between;
    margin-bottom:20px;
  }
  .carousel-head .section-title{ font-size:26px; }
  .carousel{
    position:relative;
    border-radius:12px;
    overflow:hidden;
    border:1px solid var(--line-strong);
    background:var(--surface);
  }
  .carousel-track{
    display:flex;
    transition:transform .55s cubic-bezier(.65,0,.35,1);
    will-change:transform;
  }
  .car-slide{
    min-width:100%;
    display:grid;
    grid-template-columns: 1.15fr 1fr;
    align-items:stretch;
    min-height:440px;
    cursor:pointer;
  }
  .car-slide .card-title{ transition:color .15s; }
  .car-slide:hover .card-title{ color:var(--amber-text); }
  @media(max-width:760px){ .car-slide{ grid-template-columns:1fr; min-height:auto; } }
  .car-media{
    position:relative;
    background:linear-gradient(155deg, var(--slide-a,#2A3446), var(--slide-b,#171B22) 75%);
  }
  .car-media::after{
    content:"";
    position:absolute; top:0; right:0; bottom:0; left:0;
    background:
      repeating-linear-gradient(135deg, rgba(255,182,39,0.08) 0 2px, transparent 2px 24px);
  }
  .car-media .car-index{
    position:absolute; top:20px; left:20px;
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px; color:var(--ink);
    background:rgba(18,22,29,0.55);
    border:1px solid var(--line-strong);
    padding:5px 11px; border-radius:20px;
    z-index:2;
  }
  @media(max-width:760px){ .car-media{ min-height:240px; } }
  .car-body{
    padding:44px 48px;
    display:flex; flex-direction:column; justify-content:center;
    gap:16px;
  }
  @media(max-width:760px){ .car-body{ padding:30px 26px; } }
  .car-body .pill{ font-size:12.5px; padding:5px 13px; }
  .car-body .card-title{ font-size:34px; margin:0; line-height:1.12; }
  @media(max-width:760px){ .car-body .card-title{ font-size:26px; } }
  .car-body .card-excerpt{ max-width:52ch; font-size:15.5px; }
  .car-body .card-foot{ font-size:13px; }

  .car-arrow{
    position:absolute; top:50%; transform:translateY(-50%);
    width:44px; height:44px; border-radius:50%;
    background:rgba(18,22,29,0.65);
    border:1px solid var(--line-strong);
    color:var(--ink);
    font-size:20px;
    display:flex; align-items:center; justify-content:center;
    cursor:pointer;
    z-index:5;
    transition:background .2s, border-color .2s;
  }
  .car-arrow:hover{ background:rgba(18,22,29,0.9); border-color:var(--amber); color:var(--amber-text); }
  .car-arrow.prev{ left:18px; }
  .car-arrow.next{ right:18px; }

  .car-dots{
    position:absolute; bottom:20px; left:50%; transform:translateX(-50%);
    display:flex; gap:9px;
    z-index:5;
  }
  .car-dot{
    width:9px; height:9px; border-radius:50%;
    background:rgba(238,234,224,0.3);
    border:none; cursor:pointer;
    padding:0;
    transition:background .2s, width .2s;
  }
  .car-dot.active{ background:var(--amber); width:26px; border-radius:5px; }

  /* ===== Etiket pilleri (carousel kartlarında kullanılıyor) ===== */
  .pill{
    padding:4px 10px;
    border-radius:20px;
    font-size:11.5px;
    font-weight:600;
    letter-spacing:.03em;
  }
  .pill.eko{ background:rgba(79,166,154,0.15); color:var(--teal-text); }
  .pill.gundem{ background:rgba(255,182,39,0.15); color:var(--amber-text); }
  .pill.heyet{ background:rgba(229,85,92,0.15); color:var(--red-text); }

  /* ===== Main grid ===== */
  main{ padding:56px 0 0; }
  .section-head{
    display:flex; align-items:baseline; justify-content:space-between;
    margin-bottom:22px;
    border-bottom:1px solid var(--line);
    padding-bottom:14px;
  }
  .section-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700;
    font-size:26px;
    letter-spacing:.01em;
  }
  .section-link{
    font-size:13px; color:var(--ink-dim); font-weight:500;
    display:flex; align-items:center; gap:6px;
  }
  .section-link:hover{ color:var(--amber-text); }

  .layout{
    display:grid;
    grid-template-columns: 2fr 1fr;
    gap:44px;
    align-items:start;
  }
  @media(max-width:900px){ .layout{ grid-template-columns:1fr; } }

  .feature-card{
    border:1px solid var(--line);
    border-radius:8px;
    overflow:hidden;
    background:var(--surface);
    margin-bottom:28px;
  }
  .feature-media{
    height:280px;
    position:relative;
    background:
      repeating-linear-gradient(135deg, rgba(255,182,39,0.10) 0 2px, transparent 2px 26px),
      linear-gradient(160deg, #232B3A, #171B22 70%);
    display:flex; align-items:flex-end; padding:22px;
  }
  .feature-media .pill{ background:rgba(18,22,29,0.7); color:var(--amber); backdrop-filter:blur(4px);}
  .feature-body{ padding:24px 26px 28px; }
  .card-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700;
    font-size:25px;
    line-height:1.15;
    margin:10px 0 10px;
  }
  .feature-body .card-title{ font-size:28px; }
  a.card-title-link{ transition:color .15s; }
  a.card-title-link:hover{ color:var(--amber-text); }
  .card-excerpt{ color:var(--ink-dim); font-size:14.5px; max-width:56ch; }
  .card-foot{
    display:flex; gap:16px; align-items:center;
    margin-top:16px;
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; color:var(--ink-dim);
  }

  .grid-2{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }
  @media(max-width:560px){ .grid-2{ grid-template-columns:1fr; } }
  .mini-card{
    border:1px solid var(--line);
    border-radius:8px;
    padding:20px;
    background:var(--surface);
    transition:border-color .2s, transform .2s;
  }
  .mini-card:hover{ border-color:var(--line-strong); transform:translateY(-2px); }
  .mini-card .card-title{ font-size:19px; margin:8px 0 8px; }
  .mini-card .card-excerpt{ font-size:13.5px; }

  /* ===== Sidebar: Duyurular ===== */
  .sidebar-block{
    background:var(--surface);
    border:1px solid var(--line);
    border-radius:8px;
    padding:24px;
    margin-bottom:24px;
  }
  .sidebar-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700;
    font-size:19px;
    letter-spacing:.03em;
    text-transform:uppercase;
    color:var(--amber-text);
    display:flex; align-items:center; gap:10px;
    margin-bottom:18px;
  }
  .sidebar-title::before{
    content:"";
    width:16px; height:3px;
    background:var(--amber);
    display:inline-block;
  }
  .duyuru-item{
    padding:14px 0;
    border-top:1px dashed var(--line-strong);
  }
  .duyuru-item:first-child{ border-top:none; padding-top:0; }
  .duyuru-item .tag{
    font-family:'IBM Plex Mono', monospace;
    font-size:10.5px;
    color:var(--ink-on-accent);
    background:var(--teal);
    padding:2px 7px;
    border-radius:2px;
    font-weight:600;
    letter-spacing:.04em;
  }
  .duyuru-item h4{
    font-size:14.5px;
    font-weight:600;
    margin:9px 0 5px;
    line-height:1.35;
  }
  .duyuru-item p{
    font-size:12.5px;
    color:var(--ink-dim);
  }
  .duyuru-item .date{
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    color:var(--ink-dim);
    margin-top:6px;
    display:block;
  }

  .event-row{
    display:flex; gap:14px; align-items:flex-start;
    padding:12px 0;
    border-top:1px solid var(--line);
  }
  .event-row:first-child{ border-top:none; padding-top:0; }
  .event-date{
    font-family:'IBM Plex Mono', monospace;
    background:var(--surface-2);
    border:1px solid var(--line-strong);
    border-radius:5px;
    padding:6px 8px;
    text-align:center;
    min-width:46px;
    line-height:1.1;
  }
  .event-date .d{ font-size:16px; font-weight:600; color:var(--amber-text); display:block;}
  .event-date .m{ font-size:9.5px; color:var(--ink-dim); text-transform:uppercase; }
  .event-row h4{ font-size:13.5px; font-weight:600; margin-bottom:3px;}
  .event-row span{ font-size:11.5px; color:var(--ink-dim); font-family:'IBM Plex Mono', monospace;}

  /* ===== Newsletter ===== */
  .newsletter{
    margin-top:70px;
    background:var(--surface-2);
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
  }
  .newsletter .wrap{
    padding:52px 32px;
    display:flex; justify-content:space-between; align-items:center;
    gap:30px; flex-wrap:wrap;
  }
  .newsletter h3{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800; font-size:28px;
    max-width:420px;
    line-height:1.1;
  }
  .newsletter p{ color:var(--ink-dim); font-size:14px; margin-top:8px; max-width:420px;}
  .news-form{ display:flex; gap:10px; flex-wrap:wrap; }
  .news-form input{
    background:var(--bg);
    border:1px solid var(--line-strong);
    border-radius:3px;
    padding:12px 14px;
    color:var(--ink);
    font-family:'IBM Plex Sans', sans-serif;
    font-size:14px;
    min-width:240px;
  }
  .news-form input:focus{ outline:2px solid var(--amber); outline-offset:1px; }
  .news-form input::placeholder{ color:var(--ink-dim); }

  /* ===== Footer ===== */
  footer{ padding:56px 0 30px; }
  .foot-grid{
    display:grid;
    grid-template-columns: 1.3fr repeat(5, 1fr);
    gap:28px;
    padding-bottom:36px;
    border-bottom:1px solid var(--line);
  }
  @media(max-width:1100px){ .foot-grid{ grid-template-columns: 1fr 1fr 1fr; } }
  @media(max-width:760px){ .foot-grid{ grid-template-columns:1fr 1fr; } }
  @media(max-width:480px){ .foot-grid{ grid-template-columns:1fr; } }
  .foot-col-brand{ grid-column: span 1; }
  @media(max-width:1100px){ .foot-col-brand{ grid-column: 1 / -1; } }
  .foot-col h5{
    font-family:'IBM Plex Mono', monospace;
    font-size:11.5px; letter-spacing:.1em; text-transform:uppercase;
    color:var(--ink-dim); margin-bottom:14px;
  }
  .foot-col a{
    display:block; font-size:13.5px; color:var(--ink);
    margin-bottom:10px; opacity:.85;
  }
  .foot-col a:hover{ opacity:1; color:var(--amber); }
  .foot-col a img{ max-height:26px; width:auto; }
  .app-badges{ display:flex; gap:10px; flex-wrap:wrap; }
  .app-badge{
    display:flex !important; align-items:center; gap:7px;
    border:1px solid var(--line-strong);
    border-radius:7px;
    padding:8px 12px;
    font-size:12px; font-weight:600;
    color:var(--ink) !important;
    margin-bottom:0 !important;
    opacity:1 !important;
    transition:border-color .2s, color .2s;
  }
  .app-badge:hover{ border-color:var(--amber); color:var(--amber-text) !important; }
  .foot-bottom{
    display:flex; justify-content:space-between; align-items:center;
    padding-top:26px; flex-wrap:wrap; gap:14px;
    font-size:12.5px; color:var(--ink-dim);
    font-family:'IBM Plex Mono', monospace;
  }
  .socials{ display:flex; gap:14px; }
  .socials a{
    width:32px; height:32px; border:1px solid var(--line-strong); border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    transition:border-color .2s;
  }
  .socials a:hover{ border-color:var(--amber); }

  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
  }

  /* ===== Logo (görsel + yedek metin) ===== */
  .logo-img{ height:34px; width:auto; display:block; }
  .logo-fallback{
    display:none;
    align-items:center; gap:10px;
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700; font-size:17px; letter-spacing:.01em;
    line-height:1.15;
    max-width:220px;
  }
  @media(max-width:640px){ .logo-fallback{ font-size:14px; max-width:150px; } }
  .logo-fallback .dot{
    width:8px; height:20px; background:var(--amber); border-radius:2px; display:inline-block; flex-shrink:0;
  }

  /* ===== Breadcrumb ===== */
  .breadcrumb{
    display:flex; align-items:center; gap:8px; flex-wrap:wrap;
    font-family:'IBM Plex Mono', monospace;
    font-size:12px; color:var(--ink-dim);
    padding:22px 0 0;
  }
  .breadcrumb a:hover{ color:var(--amber-text); }
  .breadcrumb .sep{ opacity:.5; }
  .breadcrumb .current{ color:var(--ink); }

  /* ===== Sayfa başlığı bandı (kategori / duyurular) ===== */
  .page-head{ padding:22px 0 34px; border-bottom:1px solid var(--line); }
  .page-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800;
    font-size:36px;
  font-size:clamp(30px, 4.5vw, 46px);
    line-height:1.05;
    margin-top:10px;
  }
  .page-sub{ color:var(--ink-dim); font-size:15px; margin-top:12px; max-width:60ch; }

  /* ===== Filtre çipleri ===== */
  .filter-row{
    display:flex; gap:10px; flex-wrap:wrap;
    padding:24px 0 0;
  }
  .chip{
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px; font-weight:500;
    padding:8px 14px;
    border-radius:20px;
    border:1px solid var(--line-strong);
    color:var(--ink-dim);
    background:transparent;
    cursor:pointer;
    transition:border-color .2s, color .2s, background .2s;
  }
  .chip:hover{ color:var(--ink); border-color:var(--ink-dim); }
  .chip.active{ background:var(--amber); border-color:var(--amber); color:var(--ink-on-accent); }

  /* ===== Kategori / liste grid ===== */
  .list-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:22px;
    padding:32px 0;
  }
  @media(max-width:920px){ .list-grid{ grid-template-columns:1fr 1fr; } }
  @media(max-width:600px){ .list-grid{ grid-template-columns:1fr; } }
  .list-grid .mini-card .card-title{ font-size:18px; }

  /* ===== Sayfalama ===== */
  .pagination{
    display:flex; align-items:center; justify-content:center; gap:8px;
    padding:20px 0 60px;
  }
  .page-btn{
    width:38px; height:38px;
    border-radius:6px;
    border:1px solid var(--line-strong);
    background:transparent;
    color:var(--ink-dim);
    font-family:'IBM Plex Mono', monospace;
    font-size:13px;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:border-color .2s, color .2s, background .2s;
  }
  .page-btn:hover{ border-color:var(--amber); color:var(--ink); }
  .page-btn.active{ background:var(--amber); border-color:var(--amber); color:var(--ink-on-accent); font-weight:600; }
  .page-btn.nav-arrow{ width:auto; padding:0 14px; }

  /* ===== Haber detay sayfası ===== */
  .article-layout{
    display:grid;
    grid-template-columns:2fr 1fr;
    gap:44px;
    align-items:start;
    padding:28px 0 0;
  }
  @media(max-width:900px){ .article-layout{ grid-template-columns:1fr; } }
  .article-header{ padding-bottom:20px; }
  .article-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:800;
    font-size:36px;
  font-size:clamp(30px, 4.5vw, 48px);
    line-height:1.05;
    margin:14px 0 16px;
  }
  .article-dek{ color:var(--ink-dim); font-size:17px; max-width:66ch; }
  .article-meta{
    display:flex; align-items:center; gap:16px; flex-wrap:wrap;
    margin-top:20px;
    font-family:'IBM Plex Mono', monospace;
    font-size:12.5px; color:var(--ink-dim);
  }
  .author-chip{ display:flex; align-items:center; gap:8px; }
  .author-avatar{
    width:26px; height:26px; border-radius:50%;
    background:linear-gradient(150deg, var(--amber), var(--amber-deep));
    flex-shrink:0;
  }
  .article-media{
    height:340px;
    border-radius:8px;
    margin:22px 0 30px;
    background:
      repeating-linear-gradient(135deg, rgba(255,182,39,0.10) 0 2px, transparent 2px 26px),
      linear-gradient(160deg, #232B3A, #171B22 70%);
    border:1px solid var(--line);
  }
  @media(max-width:760px){ .article-media{ height:200px; } }
  .article-body{ font-size:16.5px; line-height:1.8; color:var(--ink); }
  .article-body p{ margin-bottom:18px; max-width:70ch; }
  .article-body h1, .article-body h2, .article-body h3, .article-body h4{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700;
    margin:30px 0 12px;
    line-height:1.2;
  }
  .article-body h1{ font-size:28px; }
  .article-body h2{ font-size:25px; }
  .article-body h3{ font-size:22px; }
  .article-body h4{ font-size:19px; }
  .article-body a{ color:var(--amber-text); text-decoration:underline; text-underline-offset:2px; }
  .article-body ul, .article-body ol{ margin:0 0 18px; padding-left:22px; max-width:70ch; }
  .article-body li{ margin-bottom:8px; }
  .article-body img{ max-width:100%; height:auto; border-radius:8px; margin:20px 0; display:block; }
  .article-body blockquote{
    border-left:3px solid var(--amber);
    padding:6px 0 6px 22px;
    margin:26px 0;
    font-style:italic;
    color:var(--ink-dim);
    max-width:64ch;
  }
  .article-body table{ width:100%; border-collapse:collapse; margin:20px 0; font-size:14.5px; }
  .article-body th, .article-body td{ border:1px solid var(--line-strong); padding:8px 12px; text-align:left; }
  .article-body strong{ font-weight:700; color:var(--ink); }
  .article-body hr{ border:none; border-top:1px solid var(--line); margin:28px 0; }

  .pull-quote{
    border-left:3px solid var(--amber);
    padding:6px 0 6px 22px;
    margin:26px 0;
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:600;
    font-size:22px;
    line-height:1.3;
    max-width:56ch;
  }
  .tag-row{ display:flex; gap:8px; flex-wrap:wrap; margin-top:30px; }
  .tag-chip{
    font-family:'IBM Plex Mono', monospace;
    font-size:11.5px;
    padding:5px 11px;
    border-radius:20px;
    border:1px solid var(--line-strong);
    color:var(--ink-dim);
  }
  .gallery-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700; font-size:18px;
    margin:34px 0 14px;
    padding-top:24px;
    border-top:1px solid var(--line);
  }
  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(auto-fill, minmax(100px, 1fr));
    gap:10px;
  }
  .gallery-thumb{
    display:block;
    padding-top:100%;   /* aspect-ratio yedeği (Safari 15 öncesi) */
    aspect-ratio:1 / 1;
    border-radius:8px;
    overflow:hidden;
    border:1px solid var(--line-strong);
    background:var(--surface-2);
  }
  .gallery-thumb img{
    width:100%; height:100%;
    object-fit:cover;
    display:block;
    transition:transform .25s ease;
  }
  .gallery-thumb:hover img{ transform:scale(1.08); }
  .share-row{
    display:flex; align-items:center; gap:10px;
    margin-top:26px; padding-top:22px;
    border-top:1px solid var(--line);
  }
  .share-row span{ font-size:12.5px; color:var(--ink-dim); font-family:'IBM Plex Mono', monospace; margin-right:4px;}
  .share-btn{
    width:34px; height:34px; border-radius:50%;
    border:1px solid var(--line-strong);
    display:flex; align-items:center; justify-content:center;
    color:var(--ink);
    background:transparent;
    padding:0;
    cursor:pointer;
    font-family:inherit;
    transition:border-color .2s, color .2s, background .2s;
  }
  .share-btn:hover{ border-color:var(--amber); color:var(--amber-text); }
  .share-btn[data-copied="true"]{ border-color:var(--amber); color:var(--amber-text); background:rgba(255,182,39,0.12); }
  .share-tooltip{
    position:relative;
  }
  .share-tooltip::after{
    content:"Kopyalandı!";
    position:absolute;
    bottom:calc(100% + 8px);
    left:50%;
    transform:translateX(-50%);
    background:var(--ink-on-accent);
    color:#EEEAE0;
    font-family:'IBM Plex Mono', monospace;
    font-size:11px;
    padding:5px 9px;
    border-radius:5px;
    white-space:nowrap;
    opacity:0;
    pointer-events:none;
    transition:opacity .15s ease;
  }
  .share-tooltip[data-copied="true"]::after{ opacity:1; }

  .related-title{
    font-family:'Big Shoulders Display', sans-serif;
    font-weight:700; font-size:20px;
    margin:46px 0 18px;
    padding-top:26px;
    border-top:1px solid var(--line);
  }
  .related-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:20px;
    margin-bottom:50px;
  }
  @media(max-width:760px){ .related-grid{ grid-template-columns:1fr; } }

  /* ===== Duyurular sayfası — büyük liste kartı ===== */
  .duyuru-full{
    display:flex; gap:18px;
    padding:22px;
    border:1px solid var(--line);
    border-radius:8px;
    background:var(--surface);
    margin-bottom:16px;
    align-items:flex-start;
    transition:border-color .2s, transform .2s;
  }
  .duyuru-full:hover{ border-color:var(--line-strong); transform:translateY(-2px); }
  @media(max-width:600px){ .duyuru-full{ flex-direction:column; } }
  .duyuru-full .pin{
    width:44px; height:44px; border-radius:8px;
    background:var(--surface-2);
    border:1px solid var(--line-strong);
    display:flex; align-items:center; justify-content:center;
    flex-shrink:0;
    color:var(--amber-text);
  }
  .duyuru-full h3{ font-size:18px; font-weight:700; margin-bottom:6px; }
  .duyuru-full p{ color:var(--ink-dim); font-size:14px; max-width:70ch; }
  .duyuru-full .meta-row{
    display:flex; gap:12px; align-items:center; margin-top:10px;
    font-family:'IBM Plex Mono', monospace; font-size:11.5px; color:var(--ink-dim);
  }
  .duyuru-item h4 a:hover{ color:var(--amber-text); }

/* =========================================================================
   ETKİNLİK PORTALI — EK BİLEŞENLER
   Yukarıdaki kurumsal tasarım diline (renk değişkenleri, IBM Plex Sans/Mono,
   Big Shoulders Display, .wrap, .btn, .pill vb.) uyumlu olacak şekilde
   eklenmiştir: form alanları, tablolar, uyarılar, etkinlik kartları, admin
   panel düzeni.
   ========================================================================= */

/* ---- Sayfa başlığı bandı (iç sayfalar için kısa yardımcı) ---- */
.main-content{ padding-top:40px; padding-bottom:60px; }
.page-heading{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:800;
  font-size:30px;
  font-size:clamp(26px, 4vw, 38px);
  line-height:1.08;
  margin:18px 0 6px;
}
.page-subheading{ color:var(--ink-dim); font-size:15px; margin-bottom:26px; max-width:70ch; }

/* ---- Etkinlik tür filtre çipleri (mevcut .chip kullanılıyor) ---- */
.type-filters{ display:flex; gap:10px; flex-wrap:wrap; margin-bottom:26px; }
.type-filters a.chip{ text-decoration:none; display:inline-block; }
.type-filters a.chip.active{ background:var(--amber); border-color:var(--amber); color:var(--ink-on-accent); }

/* ---- Etkinlik kartları (mini-card diline dayanır) ---- */
.event-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
  gap:22px;
}
.event-card{
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;
  background:var(--surface);
  display:flex; flex-direction:column;
  transition:border-color .2s, transform .2s;
}
.event-card:hover{ border-color:var(--line-strong); transform:translateY(-3px); }
.event-card img, .event-card .event-card-media{
  width:100%; height:170px; object-fit:cover; display:block;
  background:
    repeating-linear-gradient(135deg, rgba(255,182,39,0.10) 0 2px, transparent 2px 26px),
    linear-gradient(160deg, #232B3A, #171B22 70%);
}
:root[data-theme="light"] .event-card .event-card-media{
  background:
    repeating-linear-gradient(135deg, rgba(154,91,10,0.08) 0 2px, transparent 2px 26px),
    linear-gradient(160deg, #E8ECF1, #F1F3F6 70%);
}
.event-card-body{ padding:18px 20px 22px; display:flex; flex-direction:column; flex:1; }
.event-card .pill{ width:fit-content; margin-bottom:10px; }
.event-card .card-title{ font-size:19px; margin:0 0 8px; }
.event-card .card-excerpt{ flex:1; margin-bottom:14px; }
.event-dates{
  font-family:'IBM Plex Mono', monospace;
  font-size:12px; color:var(--ink-dim);
  margin-bottom:16px;
}

.detail-hero{ margin:22px 0; }
.detail-hero img, .detail-hero .detail-hero-media{
  width:100%; max-height:400px; height:260px; object-fit:cover;
  border-radius:8px; border:1px solid var(--line);
  background:
    repeating-linear-gradient(135deg, rgba(255,182,39,0.10) 0 2px, transparent 2px 26px),
    linear-gradient(160deg, #232B3A, #171B22 70%);
}
:root[data-theme="light"] .detail-hero .detail-hero-media{
  background:
    repeating-linear-gradient(135deg, rgba(154,91,10,0.08) 0 2px, transparent 2px 26px),
    linear-gradient(160deg, #E8ECF1, #F1F3F6 70%);
}
.detail-meta{
  display:flex; gap:18px; flex-wrap:wrap;
  font-family:'IBM Plex Mono', monospace;
  font-size:13px; color:var(--ink-dim);
  margin:14px 0 22px;
}

/* ---- Kartlar (form/panel sarmalayıcı) ---- */
.card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  padding:26px;
  margin-bottom:24px;
}

/* ---- Formlar ---- */
form .form-row{ margin-bottom:18px; }
form label{
  display:block; font-size:12.5px; font-weight:600;
  margin-bottom:7px; color:var(--ink-dim);
  font-family:'IBM Plex Mono', monospace; letter-spacing:.02em;
}
form input[type=text], form input[type=email], form input[type=tel],
form input[type=number], form input[type=password], form textarea, form select{
  width:100%;
  padding:11px 13px;
  border:1px solid var(--line-strong);
  border-radius:5px;
  font-size:14px;
  font-family:'IBM Plex Sans', sans-serif;
  background:var(--bg);
  color:var(--ink);
  transition:border-color .15s ease, box-shadow .15s ease;
}
form input::placeholder, form textarea::placeholder{ color:var(--ink-dim); opacity:.8; }
form textarea{ min-height:96px; resize:vertical; }
form input[type=text]:focus, form input[type=email]:focus, form input[type=tel]:focus,
form input[type=number]:focus, form input[type=password]:focus, form textarea:focus, form select:focus{
  outline:none; border-color:var(--amber);
  box-shadow:0 0 0 3px rgba(255,182,39,0.15);
}
form input:disabled{ background:var(--surface-2); color:var(--ink-dim); cursor:not-allowed; }
.form-grid-2{ display:grid; grid-template-columns:1fr 1fr; gap:18px; }
@media(max-width:640px){ .form-grid-2{ grid-template-columns:1fr; } }
.radio-group{ display:flex; gap:20px; }
.radio-group label{
  display:flex; align-items:center; gap:7px;
  font-family:'IBM Plex Sans', sans-serif; font-weight:500;
  color:var(--ink); text-transform:none; letter-spacing:normal;
}
.radio-group input{ accent-color:var(--amber); width:16px; height:16px; }

/* ---- Uyarı kutuları ---- */
.alert{
  padding:14px 18px;
  border-radius:6px;
  margin-bottom:20px;
  font-size:14px;
  border:1px solid transparent;
}
.alert-success{ background:rgba(79,166,154,0.12); border-color:rgba(79,166,154,0.35); color:var(--teal-text); }
.alert-error{ background:rgba(229,85,92,0.12); border-color:rgba(229,85,92,0.35); color:var(--red-text); }
.alert-info{ background:rgba(255,182,39,0.10); border-color:rgba(255,182,39,0.3); color:var(--amber-text); }

/* ---- Veri tabloları (admin raporları) ---- */
table.data-table{
  width:100%; border-collapse:collapse;
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:8px;
  overflow:hidden;
  font-size:14px;
}
table.data-table th, table.data-table td{
  padding:11px 15px;
  border-bottom:1px solid var(--line);
  text-align:left;
}
table.data-table th{
  background:var(--surface-2);
  font-family:'IBM Plex Mono', monospace;
  font-size:11.5px; text-transform:uppercase; letter-spacing:.06em;
  color:var(--ink-dim); font-weight:600;
}
table.data-table tr:hover td{ background:var(--hover-tint); }
table.data-table tr:last-child td{ border-bottom:none; }

/* ---- Bağlantı görünümlü butonlar (form içi aksiyonlar) ---- */
.btn-link, .btn-link-danger{
  background:none; border:none; padding:0; cursor:pointer;
  font:inherit; font-family:'IBM Plex Sans', sans-serif;
  text-decoration:underline; text-underline-offset:2px;
}
.btn-link{ color:var(--amber-text); }
.btn-link-danger{ color:var(--red-text); }
.btn-link:hover, .btn-link-danger:hover{ opacity:.75; }

/* ---- Ek buton varyantları (kurumsal tasarımda yalnızca .btn / .btn.ghost var) ---- */
.btn-accent{
  /* .btn zaten amber; bu, mevcut sayfalarda "vurgulu aksiyon" icin kullanilan
     isimle geriye donuk uyumluluk sağlar - .btn ile ayni gorunur. */
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:600; font-size:13.5px;
  padding:10px 20px; border-radius:3px;
  border:1px solid var(--amber);
  color:var(--ink-on-accent); background:var(--amber);
  cursor:pointer; display:inline-block; text-decoration:none;
  transition:transform .15s ease, box-shadow .15s ease;
}
.btn-accent:hover{ transform:translateY(-1px); box-shadow:0 6px 18px rgba(255,182,39,0.25); }
.btn-secondary{
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:600; font-size:13.5px;
  padding:10px 20px; border-radius:3px;
  border:1px solid var(--line-strong);
  color:var(--ink); background:var(--surface-2);
  cursor:pointer; display:inline-block; text-decoration:none;
  transition:border-color .15s ease, color .15s ease;
}
.btn-secondary:hover{ border-color:var(--ink-dim); }
.btn-outline{
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:600; font-size:13.5px;
  padding:9px 19px; border-radius:3px;
  border:1px solid var(--line-strong);
  color:var(--ink); background:transparent;
  cursor:pointer; display:inline-block; text-decoration:none;
  transition:border-color .15s ease, color .15s ease;
}
.btn-outline:hover{ border-color:var(--amber); color:var(--amber-text); }
.btn-danger{
  font-family:'IBM Plex Sans', sans-serif;
  font-weight:600; font-size:13.5px;
  padding:10px 20px; border-radius:3px;
  border:1px solid var(--red);
  color:#fff; background:var(--red);
  cursor:pointer; display:inline-block; text-decoration:none;
}

/* ---- Üye/işlem kutuları ---- */
.lookup-box{ display:flex; gap:12px; align-items:end; margin-bottom:20px; flex-wrap:wrap; }
.lookup-box .form-row{ flex:1; min-width:220px; margin-bottom:0; }
#lookupStatus{ font-size:13px; margin-top:8px; }

/* =========================================================================
   ADMİN PANELİ
   ========================================================================= */
.admin-shell{ display:flex; min-height:100vh; background:var(--bg); }
.admin-sidebar{
  width:230px; flex-shrink:0;
  background:var(--surface);
  border-right:1px solid var(--line);
  padding:22px 0;
}
.admin-sidebar .brand{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:800; font-size:18px;
  padding:4px 22px 22px;
  display:flex; align-items:center; gap:8px;
}
.admin-sidebar .brand::before{
  content:""; width:8px; height:20px; background:var(--amber); border-radius:2px; display:inline-block;
}
.admin-sidebar a{
  display:block; padding:11px 22px;
  font-size:13.5px; font-weight:500;
  color:var(--ink-dim); text-decoration:none;
  border-left:2px solid transparent;
  transition:background .15s, color .15s, border-color .15s;
}
.admin-sidebar a:hover{ background:var(--hover-tint); color:var(--ink); }
.admin-sidebar a.active{ background:var(--hover-tint); color:var(--amber-text); border-left-color:var(--amber); }
.admin-content{ flex:1; padding:32px 36px; max-width:1200px; }
.admin-topbar{
  display:flex; justify-content:space-between; align-items:center;
  margin-bottom:26px; padding-bottom:16px; border-bottom:1px solid var(--line);
}
.admin-topbar > div:last-child{ font-size:13px; color:var(--ink-dim); font-family:'IBM Plex Mono', monospace; }
.stat-cards{ display:grid; grid-template-columns:repeat(auto-fit, minmax(180px,1fr)); gap:16px; margin-bottom:30px; }
.stat-card{ background:var(--surface); border:1px solid var(--line); border-radius:8px; padding:20px; }
.stat-card .num{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:800; font-size:30px; color:var(--amber-text);
}
.stat-card .label{ color:var(--ink-dim); font-size:12.5px; font-family:'IBM Plex Mono', monospace; margin-top:4px; }
.toolbar{ display:flex; justify-content:space-between; align-items:center; margin-bottom:18px; flex-wrap:wrap; gap:12px; }
.toolbar select{
  padding:9px 12px; border-radius:5px; border:1px solid var(--line-strong);
  background:var(--surface); color:var(--ink); font-family:'IBM Plex Sans', sans-serif; font-size:13.5px;
}

/* ---- Üyelik / hesap durumu (header nav-right içinde) ---- */
.member-nav{ display:flex; align-items:center; gap:14px; font-size:13.5px; }
.member-nav a{ color:var(--ink-dim); transition:color .15s; }
.member-nav a:hover{ color:var(--amber-text); }
.member-nav .member-name{ color:var(--ink); font-weight:600; }

/* ---- Logo (gerçek görsel logo dosyası olmadan, metin tabanlı) ---- */
.logo-text-only{ display:flex; align-items:center; gap:10px; flex-wrap:nowrap; }
.logo-sub{
  font-family:'IBM Plex Mono', monospace;
  font-weight:500; font-size:11px; letter-spacing:.06em;
  text-transform:uppercase;
  color:var(--amber-text);
  border-left:1px solid var(--line-strong);
  padding-left:10px; margin-left:2px;
}
@media(max-width:640px){ .logo-sub{ display:none; } }

/* ---- "Etkinlikler" - bu alt-sitenin kendi bölümünü temsil eden vurgulu nav öğesi ---- */
a.nav-trigger-link{ text-decoration:none; display:flex; align-items:center; }
a.nav-trigger-link.active-section{
  color:var(--amber-text);
  background:rgba(255,182,39,0.10);
  font-weight:600;
}

@media(max-width:920px){
  .admin-shell{ flex-direction:column; }
  .admin-sidebar{ width:100%; border-right:none; border-bottom:1px solid var(--line); display:flex; overflow-x:auto; padding:10px 0; }
  .admin-sidebar .brand{ display:none; }
  .admin-sidebar a{ white-space:nowrap; border-left:none; border-bottom:2px solid transparent; }
  .admin-sidebar a.active{ border-left:none; border-bottom-color:var(--amber); }
  .admin-content{ padding:22px 18px; }
}


/* =========================================================================
   RANDEVU EŞLEŞTİRME — firma × saat ızgarası

   TASARIM İLKESİ: Izgara yüzlerce hücreden oluşur (firma × saat × gün).
   Bu yüzden BOŞ hücreler bilerek neredeyse görünmezdir — tablo çizgileri
   dışında hiçbir şey çizmezler ve üzerlerinde yazı yoktur. Göz yalnızca
   ANLAMLI olana takılır: sizin randevunuz (amber, ✓) ve dolu saatler
   (soluk taramalı). "Dolu" için kırmızı KULLANILMAZ; dolu bir saat bir
   hata değil, sadece kullanılamaz bir seçenektir.
   ========================================================================= */

:root{
  --violet:#8B7BD8;
  --violet-text:#A99BEA;
}
:root[data-theme="light"]{
  --violet-text:#5B48B8;
}

/* Etkinlik türü rozeti (Eğitim=teal, Fuar=amber, Heyet=red, Randevu=mor) */
.pill.randevu{ background:rgba(139,123,216,0.16); color:var(--violet-text); }

/* ---- Üst araç çubuğu: lejant + firma arama ---- */
.appt-toolbar{
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:12px 20px;
  margin-bottom:16px;
}
.appt-legend{ display:flex; flex-wrap:wrap; gap:6px 18px; font-size:11.5px; color:var(--ink-dim); }
.appt-legend span{ display:flex; align-items:center; gap:7px; }
.appt-legend .sw{
  width:22px; height:15px; border-radius:3px; display:inline-block;
  border:1px solid var(--line-strong);
}
.appt-legend .sw-free{ background:var(--hover-tint); }
.appt-legend .sw-mine{ background:var(--amber); border-color:var(--amber); }
.appt-legend .sw-taken{
  border-color:var(--line-strong);
  background:repeating-linear-gradient(45deg,
    var(--hover-tint) 0 3px, transparent 3px 6px);
}
.appt-search input[type=search]{
  width:220px; padding:7px 12px; font-size:12.5px;
  border:1px solid var(--line-strong); border-radius:20px;
  background:var(--bg); color:var(--ink);
  font-family:'IBM Plex Sans', sans-serif;
}
.appt-search input[type=search]:focus{
  outline:none; border-color:var(--amber); box-shadow:0 0 0 3px rgba(255,182,39,0.15);
}

/* ---- Kaydet çubuğu (kaydırırken üstte sabit kalır) ---- */
.appt-bar{
  position:sticky; top:0; z-index:6;
  display:flex; align-items:center; justify-content:space-between;
  flex-wrap:wrap; gap:14px;
  background:var(--surface);
  border:1px solid var(--line-strong);
  border-radius:8px;
  padding:12px 18px;
  margin-bottom:12px;
}
.appt-bar-main{ display:flex; align-items:baseline; gap:10px; }
.appt-count{ font-family:'IBM Plex Mono', monospace; font-size:17px; color:var(--amber-text); font-weight:500; }
.appt-count .sep{ opacity:.45; margin:0 2px; }
.appt-count-label{ font-size:12px; color:var(--ink-dim); }
.appt-bar-bottom{ position:static; margin-top:6px; }

/* ---- "Seçtikleriniz" özeti ----
   Kullanıcı ne seçtiğini görmek için geniş ızgarayı taramak zorunda
   kalmasın diye, seçimler ayrıca düz bir liste olarak gösterilir. ---- */
.appt-picked{
  border:1px solid rgba(255,182,39,0.35);
  background:rgba(255,182,39,0.07);
  border-radius:8px;
  padding:12px 16px;
  margin-bottom:14px;
}
.appt-picked-title{
  display:block; font-family:'IBM Plex Mono', monospace;
  font-size:10.5px; letter-spacing:.06em; text-transform:uppercase;
  color:var(--amber-text); margin-bottom:8px;
}
.appt-picked ul{ list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:8px; }
.appt-picked li{
  display:flex; align-items:center; gap:9px;
  background:var(--surface);
  border:1px solid var(--line-strong);
  border-radius:20px;
  padding:5px 5px 5px 12px;
  font-size:12px;
}
.appt-picked .when{ font-family:'IBM Plex Mono', monospace; font-size:11px; color:var(--ink-dim); }
.appt-picked .who{ font-weight:500; color:var(--ink); }
.appt-picked .drop{
  width:20px; height:20px; line-height:1; flex-shrink:0;
  border:none; border-radius:50%;
  background:var(--surface-2); color:var(--ink-dim);
  font-size:14px; cursor:pointer; padding:0;
}
.appt-picked .drop:hover{ background:var(--red); color:#fff; }

.appt-hint{ font-size:12.5px; color:var(--ink-dim); margin:0 0 20px; max-width:75ch; }

.appt-day-title{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:600; font-size:18px;
  margin:24px 0 9px;
  color:var(--ink);
}

/* ---- Izgaranın yatay kaydırma kabı ----
   Geniş tablo KENDİ kabında kayar; sayfa gövdesi yatayda kaymaz. ---- */
.appt-scroll{
  overflow-x:auto;
  border:1px solid var(--line);
  border-radius:8px;
  background:var(--surface);
  margin-bottom:20px;
}

table.appt-grid{
  border-collapse:separate;
  border-spacing:0;
  width:max-content;
  min-width:100%;
  font-size:12px;
}
table.appt-grid th, table.appt-grid td{
  border-bottom:1px solid var(--line);
  padding:0;
  text-align:center;
  vertical-align:middle;
}
table.appt-grid tbody tr:last-child th,
table.appt-grid tbody tr:last-child td{ border-bottom:none; }

/* Saat başlığı satırı */
table.appt-grid thead th{
  position:sticky; top:0; z-index:2;
  background:var(--surface-2);
  font-family:'IBM Plex Mono', monospace;
  font-size:10.5px; font-weight:400;
  color:var(--ink-dim);
  padding:7px 4px;
  white-space:nowrap;
}
table.appt-grid th.appt-time{ min-width:48px; }

/* Saat değişiminde daha belirgin dikey ayraç — geniş ızgarada
   gözün saati takip etmesini kolaylaştırır */
table.appt-grid th.hb, table.appt-grid td.hb{ border-left:1px solid var(--line-strong); }

/* Firma sütunu: yatay kaydırmada solda sabit kalır */
table.appt-grid th.appt-firm, table.appt-grid th.appt-corner{
  position:sticky; left:0; z-index:3;
  background:var(--surface);
  border-right:1px solid var(--line-strong);
  text-align:left;
  min-width:190px; max-width:270px;
  padding:7px 13px;
  font-weight:500;
  font-family:'IBM Plex Sans', sans-serif;
}
table.appt-grid th.appt-corner{ z-index:4; background:var(--surface-2); }
.appt-firm-name{ display:block; font-size:12.5px; color:var(--ink); line-height:1.3; }
table.appt-grid th.appt-firm small{
  display:block; font-weight:400; font-size:10.5px;
  color:var(--ink-dim); margin-top:2px;
}

/* Satır vurgusu: geniş ızgarada satırı kaybetmemek için */
table.appt-grid tbody tr:hover th.appt-firm{ background:var(--surface-2); }
table.appt-grid tbody tr:hover td{ background:var(--hover-tint); }

/* ---- Hücreler ---- */
table.appt-grid td.appt-cell{ padding:3px; }
.slot-wrap{ display:block; cursor:pointer; position:relative; }
.slot-wrap input.appt-chk{ position:absolute; opacity:0; width:0; height:0; margin:0; }

/* BOŞ hücre: bilerek çok sessiz — yazı yok, sadece hafif bir zemin */
.slot{
  display:block;
  height:26px; min-width:44px;
  border-radius:4px;
  background:var(--hover-tint);
  border:1px solid transparent;
  transition:background-color .12s ease, border-color .12s ease;
}
.slot-wrap:hover .slot{ background:rgba(255,182,39,0.18); border-color:var(--amber); }

/* SEÇİLİ (bu ziyaretçinin randevusu): tek göze çarpan renk */
.slot-wrap input.appt-chk:checked + .slot{
  background:var(--amber);
  border-color:var(--amber);
  position:relative;
}
.slot-wrap input.appt-chk:checked + .slot::after{
  content:"✓";
  position:absolute; top:0; right:0; bottom:0; left:0;
  display:flex; align-items:center; justify-content:center;
  color:var(--ink-on-accent); font-size:12px; font-weight:500;
}
.slot-wrap input.appt-chk:focus-visible + .slot{ outline:2px solid var(--amber); outline-offset:2px; }

/* DOLU: kırmızı değil — soluk taramalı, "yok sayılacak" alan */
.slot.taken{
  cursor:not-allowed;
  background:repeating-linear-gradient(45deg,
    var(--hover-tint) 0 3px, transparent 3px 6px);
  border-color:var(--line);
}

/* Aynı saatte başka firma seçildiği ya da sınıra ulaşıldığı için kapalı */
.slot-wrap.is-blocked{ cursor:not-allowed; }
.slot-wrap.is-blocked .slot{ opacity:.3; }
.slot-wrap.is-blocked:hover .slot{ background:var(--hover-tint); border-color:transparent; }

/* ---- Admin görünümü: hücrede katılımcı adı + iptal düğmesi ---- */
table.appt-grid-admin td.appt-cell{ position:relative; padding:4px; }
.appt-booked{
  display:block;
  padding:7px 20px 7px 9px;
  border-radius:4px;
  background:rgba(79,166,154,0.14);
  border:1px solid rgba(79,166,154,0.3);
  color:var(--teal-text);
  font-size:11.5px; font-weight:500;
  text-align:left;
  max-width:170px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.appt-empty{
  display:block; height:26px; min-width:48px;
  border-radius:4px; background:var(--hover-tint);
}
.appt-del{
  position:absolute; top:6px; right:6px;
  width:18px; height:18px; line-height:1;
  border:none; border-radius:50%;
  background:transparent; color:var(--ink-dim);
  font-size:13px; cursor:pointer; padding:0;
}
.appt-del:hover{ background:var(--red); color:#fff; }

@media(max-width:640px){
  .appt-bar{ position:static; }
  table.appt-grid th.appt-firm, table.appt-grid th.appt-corner{ min-width:150px; padding:8px 10px; }
  .appt-search input[type=search]{ width:100%; }
  .appt-toolbar{ flex-direction:column; align-items:stretch; }
}

/* =========================================================================
   RANDEVU RAPORLARI (admin/appointment-reports.asp)
   Ekranda okunaklı, kâğıda basıldığında da düzgün çıkan iki yönlü rapor:
   katılımcı firmalara göre ve randevu alan ziyaretçilere göre.
   ========================================================================= */

.report-head{ margin-bottom:16px; }
.report-head h2{
  font-family:'Big Shoulders Display', sans-serif;
  font-weight:600; font-size:24px; line-height:1.1; color:var(--ink);
}
.report-meta{
  font-family:'IBM Plex Mono', monospace;
  font-size:11.5px; color:var(--ink-dim); margin-top:5px;
}

/* ---- Görünüm sekmeleri ---- */
.report-tabs{
  display:flex; align-items:center; gap:8px;
  flex-wrap:wrap;
  border-bottom:1px solid var(--line);
  padding-bottom:12px; margin-bottom:22px;
}
.report-tabs .spacer{ flex:1; }
.report-tabs > a:not(.btn){
  font-size:12.5px; font-weight:500;
  padding:7px 15px; border-radius:20px;
  border:1px solid var(--line-strong);
  color:var(--ink-dim); text-decoration:none;
  transition:border-color .15s ease, color .15s ease;
}
.report-tabs > a:not(.btn):hover{ color:var(--ink); border-color:var(--ink-dim); }
.report-tabs > a.active{
  background:var(--amber); border-color:var(--amber);
  color:var(--ink-on-accent);
}

/* ---- Gruplanmış rapor kartları ---- */
.report-group h3{
  font-size:15px; font-weight:600; color:var(--ink);
  margin:0 0 12px; padding-bottom:9px;
  border-bottom:1px solid var(--line);
}
.report-group h3 .sub{
  font-weight:400; font-size:12px; color:var(--ink-dim);
  margin-left:9px;
}

table.report-table{ font-size:12.5px; }
table.report-table th{ font-size:10.5px; }
table.report-table td.mono{ font-family:'IBM Plex Mono', monospace; font-size:11.5px; white-space:nowrap; }
/* Genel "soluk metin" yardimci sinifi (yalnizca rapor tablolarinda
   degil, her yerde kullanilabilsin diye) */
.dim{ color:var(--ink-dim); }
table.report-table .dim{ color:var(--ink-dim); font-size:11px; }

/* Doluluk çubuğu */
.bar{
  height:7px; border-radius:4px;
  background:var(--surface-2);
  overflow:hidden;
}
.bar span{
  display:block; height:100%;
  background:var(--amber);
  border-radius:4px;
}

/* ---- Yazdırma ----
   Kâğıda basılırken ekran kromu (menü, düğmeler, sekmeler) çıkmasın;
   her firma/ziyaretçi grubu mümkün olduğunca bölünmeden bassın. ---- */
@media print{
  .no-print, .admin-sidebar, .admin-topbar, .report-tabs{ display:none !important; }
  .admin-shell{ display:block; }
  .admin-content{ padding:0; }
  body{ background:#fff; color:#000; }
  .card, .report-group{
    border:1px solid #ccc; background:#fff;
    break-inside:avoid; page-break-inside:avoid;
    margin-bottom:14px; padding:14px;
  }
  .report-group h3{ border-bottom:1px solid #999; }
  table.report-table{ font-size:10.5pt; }
  table.data-table th{ background:#eee !important; color:#000 !important; }
  table.data-table td, table.data-table th{ border-color:#ccc !important; color:#000 !important; }
  .bar{ border:1px solid #999; }
  .bar span{ background:#666; }
  a{ color:#000 !important; text-decoration:none !important; }
}

/* =========================================================================
   MEMNUNİYET ANKETİ
   Katılımcı formu (1–5 puanlama) ve admin sonuç grafikleri.
   ========================================================================= */

/* ---- Puan ölçeği açıklaması ---- */
.survey-scale-legend{
  display:flex; justify-content:space-between; gap:8px;
  font-family:'IBM Plex Mono', monospace;
  font-size:10.5px; color:var(--ink-dim);
  padding-bottom:14px; margin-bottom:6px;
  border-bottom:1px solid var(--line);
}
@media(max-width:560px){
  .survey-scale-legend span:nth-child(2),
  .survey-scale-legend span:nth-child(4){ display:none; }
}

/* ---- Tek bir soru ---- */
.survey-q{
  padding:16px 0;
  border-bottom:1px solid var(--line);
}
.survey-q:last-of-type{ border-bottom:none; }
.survey-q-text{
  font-size:14.5px; color:var(--ink);
  margin-bottom:12px; line-height:1.45;
}
.survey-q-text .no{ color:var(--ink-dim); font-family:'IBM Plex Mono', monospace; margin-right:4px; }
.survey-q.is-missing{
  background:rgba(229,85,92,0.06);
  border-left:3px solid var(--red);
  padding-left:12px; margin-left:-15px;
}

/* ---- 1–5 seçenekleri ---- */
.survey-scale{ display:flex; gap:8px; flex-wrap:wrap; }
.survey-opt{ display:block; cursor:pointer; margin:0; }
.survey-opt input{ position:absolute; opacity:0; width:0; height:0; }
.survey-opt span{
  display:flex; align-items:center; justify-content:center;
  width:46px; height:40px;
  border:1px solid var(--line-strong);
  border-radius:6px;
  background:var(--bg);
  color:var(--ink-dim);
  font-family:'IBM Plex Mono', monospace;
  font-size:15px;
  transition:background-color .12s ease, border-color .12s ease, color .12s ease;
}
.survey-opt:hover span{ border-color:var(--amber); color:var(--ink); }
.survey-opt input:checked + span{
  background:var(--amber); border-color:var(--amber);
  color:var(--ink-on-accent); font-weight:600;
}
.survey-opt input:focus-visible + span{ outline:2px solid var(--amber); outline-offset:2px; }

/* ---- Admin: 1–5 dağılım çubukları ---- */
.score-bars{ display:flex; align-items:flex-end; gap:5px; height:44px; }
.score-bar{
  flex:1; display:flex; flex-direction:column; align-items:center; justify-content:flex-end;
  height:100%;
}
.score-bar i{
  display:block; width:100%;
  background:var(--amber); opacity:.75;
  border-radius:2px 2px 0 0;
  min-height:0;
}
.score-bar b{
  font-family:'IBM Plex Mono', monospace;
  font-size:9.5px; font-weight:400; color:var(--ink-dim);
  margin-top:3px;
}

/* ---- Admin: katılımcı yorumları ---- */
.survey-comment{
  border-left:3px solid var(--line-strong);
  padding:2px 0 2px 14px;
  margin-bottom:16px;
}
.survey-comment p{ font-size:13.5px; color:var(--ink); line-height:1.55; }
.survey-comment .who{
  font-family:'IBM Plex Mono', monospace;
  font-size:11px; color:var(--ink-dim); margin-top:5px;
}

/* =========================================================================
   KATILIM KARTI (/katilim-karti/<token>)
   Katılımcının telefonunda göstereceği kare kodlu kart.
   ========================================================================= */

.checkin-card{
  max-width:420px; margin:10px auto 0;
  background:var(--surface);
  border:1px solid var(--line-strong);
  border-radius:14px;
  overflow:hidden;
  text-align:center;
}
.checkin-card .cc-head{ padding:24px 22px 18px; border-bottom:1px dashed var(--line-strong); }
.checkin-card .cc-head h1{
  font-family:'Big Shoulders Display',sans-serif;
  font-weight:700; font-size:26px; line-height:1.12;
  margin:12px 0 10px;
}
.checkin-card .cc-meta{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px; color:var(--ink-dim); line-height:1.7;
}

/* Kare kod her zaman BEYAZ zeminde: koyu temada okunurluğu düşmesin */
.checkin-card .cc-qr{ padding:24px 22px 14px; }
.checkin-card .cc-qr #qrbox{
  display:inline-block; background:#fff;
  padding:14px; border-radius:10px; line-height:0;
}
.checkin-card .cc-qr #qrbox img,
.checkin-card .cc-qr #qrbox canvas{ display:block; }
.checkin-card .cc-qr-hint{ font-size:12.5px; color:var(--ink-dim); margin-top:12px; }

.checkin-card .cc-who{ padding:6px 22px 20px; }
.checkin-card .cc-who .name{ font-size:17px; font-weight:600; color:var(--ink); }
.checkin-card .cc-who .sub{ font-size:13px; color:var(--ink-dim); margin-top:3px; }

.checkin-card .cc-status{
  padding:13px 22px; font-size:13.5px; font-weight:500;
  font-family:'IBM Plex Mono',monospace;
}
.checkin-card .cc-status span{ display:block; font-size:11.5px; opacity:.8; margin-top:2px; }
.checkin-card .cc-status.ok{ background:rgba(79,166,154,0.15); color:var(--teal-text); }
.checkin-card .cc-status.wait{ background:var(--surface-2); color:var(--ink-dim); }

.cc-tip{
  max-width:420px; margin:16px auto 0;
  font-size:12.5px; color:var(--ink-dim); text-align:center; line-height:1.6;
}

/* ---- Admin: katılım listesi ---- */
.att-link{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  background:var(--surface-2);
  border:1px solid var(--line-strong);
  border-radius:8px; padding:12px 14px;
  font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  word-break:break-all;
}
.att-link .u{ flex:1; min-width:220px; color:var(--amber-text); }

/* =========================================================================
   ÖNİZLEME (yayına alınmamış etkinliği test etme)
   ========================================================================= */

/* Ziyaretçi tarafındaki uyarı şeridi — her sayfanın en üstünde.
   Amaç: yayındaki site ile test görünümünün karıştırılmaması. */
.preview-bar{
  display:flex; align-items:center; gap:12px; flex-wrap:wrap;
  background:repeating-linear-gradient(45deg,
    rgba(255,182,39,0.14) 0 12px, rgba(255,182,39,0.07) 12px 24px);
  border-bottom:2px solid var(--amber);
  padding:9px 20px;
  font-size:13px; color:var(--ink);
}
.preview-bar .tag{
  background:var(--amber); color:var(--ink-on-accent);
  font-family:'IBM Plex Mono',monospace; font-weight:600;
  font-size:10.5px; letter-spacing:.1em;
  padding:4px 10px; border-radius:4px; flex-shrink:0;
}
.preview-bar .txt{ flex:1; min-width:200px; color:var(--ink-dim); }
.preview-bar a{
  color:var(--amber-text); text-decoration:underline;
  white-space:nowrap; font-weight:500;
}

/* Admin: etkinlik düzenleme sayfasındaki önizleme kutusu */
.preview-box{
  border:1px solid rgba(255,182,39,0.4);
  background:rgba(255,182,39,0.06);
  border-radius:8px;
  padding:16px 18px;
  margin-bottom:24px;
}
.preview-box .pb-head{ margin-bottom:12px; }
.preview-box .pb-head strong{ font-size:14px; color:var(--ink); }
.preview-box .pb-head span{
  display:block; font-size:12.5px; color:var(--ink-dim); margin-top:3px;
}
.preview-box .pb-note{
  font-size:12.5px; color:var(--ink-dim); line-height:1.6; margin-top:12px;
}

/* Etkinlik listesindeki "Sil" bağlantısı — tehlikeli işlem olduğu için
   diğer bağlantılardan renkle ayrılır. */
a.sil-link{ color:var(--red-text); text-decoration:none; }
a.sil-link:hover{ text-decoration:underline; }

/* ==================================================================
   KARTVIZIT TARAMA VE HAVUZU  (admin/card-scan.asp, admin/cards.asp)

   Ekran ONCELIKLE TELEFONDA kullanilir: fuar/heyet sirasinda elde
   tutulan kartvizit okutulur. Bu yuzden duzen once tek sutun olarak
   tasarlandi; genis ekranda kamera ve form yan yana gelir.
   ================================================================== */

.kv-wrap{
  display:grid;
  grid-template-columns:1fr;
  gap:20px;
  align-items:start;
}
@media (min-width:900px){
  .kv-wrap{ grid-template-columns:minmax(320px,1fr) minmax(340px,1fr); }
}

/* ---- kamera kutusu ---- */
.kv-cam{
  position:relative;
  width:100%;
  background:#0C0F14;
  border:1px solid var(--line-strong);
  border-radius:12px;
  overflow:hidden;
}
/* aspect-ratio eski Safari'de (iOS 14 oncesi) yok; padding hilesi
   her yerde calisir. Kartvizit yatay oldugu icin 4:3 secildi. */
.kv-cam::before{ content:""; display:block; padding-top:75%; }
.kv-cam > video,
.kv-cam > img{
  position:absolute; top:0; left:0; right:0; bottom:0;
  width:100%; height:100%;
  object-fit:cover;
  background:#0C0F14;
}
.kv-cam > canvas{ display:none; }

/* Kamera acilmadan once ortada duran baslatma katmani */
.kv-start{
  position:absolute; top:0; left:0; right:0; bottom:0;
  display:flex; flex-direction:column;
  align-items:center; justify-content:center;
  gap:12px; padding:20px; text-align:center;
}
.kv-start > button{
  font-family:inherit; font-size:16px; font-weight:600;
  padding:14px 28px; border-radius:10px; cursor:pointer;
  border:none; background:var(--amber); color:var(--ink-on-accent);
}
.kv-start > button:disabled{ opacity:.55; cursor:default; }
#kvStartNote{ font-size:13px; color:var(--ink-dim); margin:0; }
.kv-file{
  font-size:12.5px; color:var(--ink-dim);
  display:flex; flex-direction:column; align-items:center; gap:6px;
}
.kv-file input{ font-size:12px; max-width:220px; }
.kv-diag{
  font-size:12.5px; line-height:1.55; color:var(--amber-text);
  background:rgba(255,182,39,0.10);
  border:1px solid rgba(255,182,39,0.30);
  border-radius:8px; padding:10px 12px; max-width:340px;
}

/* Kamera acikken kartvizit cercevesi.
   ONEMLI: Bu cerceve SUS DEGILDIR - fotograf CEKILIRKEN tam olarak bu
   dikdortgen kirpilir ve OCR'a yalnizca burasi verilir. Konumu ve olcusu
   JavaScript tarafindan (kirpma ile ayni hesaptan) verilir; bu yuzden
   burada koordinat YOKTUR. Kartvizit orani (85x55 mm) korunur. */
.kv-guide{
  position:absolute;
  border:2px dashed rgba(255,182,39,0.75);
  border-radius:8px;
  box-shadow:0 0 0 2000px rgba(0,0,0,0.35);
  pointer-events:none;
}

.kv-actions{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center;
  margin-top:14px;
}
.kv-actions select{ font-size:13px; padding:8px 10px; }

.kv-status{
  font-size:13px; line-height:1.6; color:var(--ink-dim);
  margin:12px 0 0; min-height:20px;
}
.kv-status.kv-ok{ color:var(--teal-text); }
.kv-status.kv-hata{ color:var(--red-text); }

.kv-raw{
  margin-top:12px; font-size:12.5px; color:var(--ink-dim);
}
.kv-raw pre{
  white-space:pre-wrap; word-break:break-word;
  background:var(--surface); border:1px solid var(--line);
  border-radius:8px; padding:10px 12px; max-height:220px; overflow:auto;
  font-size:12px; line-height:1.5;
}

/* ---- form ---- */
.kv-form{ margin:0; }
.kv-badge{
  font-size:12.5px; font-weight:600; line-height:1.5;
  border-radius:8px; padding:9px 12px; margin-bottom:14px;
  border:1px solid var(--line-strong); color:var(--ink-dim);
}
.kv-badge-qr{
  color:var(--teal-text);
  border-color:rgba(79,166,154,0.40); background:rgba(79,166,154,0.10);
}
.kv-badge-ocr{
  color:var(--amber-text);
  border-color:rgba(255,182,39,0.40); background:rgba(255,182,39,0.10);
}
.kv-check{
  display:flex; align-items:center; gap:8px;
  font-size:13px; color:var(--ink-dim); margin:6px 0 16px;
}
.kv-check input{ width:auto; margin:0; }

/* ---- havuz listesi ---- */
.kv-tag{
  display:inline-block; font-size:11.5px; font-weight:600;
  padding:3px 8px; border-radius:20px;
  border:1px solid var(--line-strong); color:var(--ink-dim);
}
.kv-tag-qr{
  color:var(--teal-text);
  border-color:rgba(79,166,154,0.40); background:rgba(79,166,154,0.10);
}
.kv-tag-ocr{
  color:var(--amber-text);
  border-color:rgba(255,182,39,0.40); background:rgba(255,182,39,0.10);
}
.kv-edit-row > td{ background:var(--hover-tint); }
.kv-edit-form{ padding:6px 2px 10px; }
.kv-edit-form .form-row{ margin-bottom:10px; }