/* ── Editor Sticky Bar (base — versteckt auf Desktop) ─── */
.editor-sticky-bar{
  display:none;
  position:fixed;bottom:0;left:0;right:0;
  background:#fff;border-top:1px solid #e8e8e8;
  padding:.5rem .75rem;gap:.5rem;z-index:1000;
  box-shadow:0 -2px 8px rgba(0,0,0,.08);
  align-items:center;
}
.editor-sticky-bar .btn-new{flex:1;justify-content:center}

/* ═══════════════════════════════════════════════════
   MOBILE — alle Admin-Seiten
   ═══════════════════════════════════════════════════ */
@media(max-width:768px){

  /* ── Nav + Burger ─────────────────────────────── */
  .top-nav{position:relative;flex-wrap:wrap}
  .nav-links{display:none!important;position:absolute;top:44px;left:0;right:0;background:#fff;border-bottom:1px solid #e8e8e8;padding:.5rem 1rem;flex-direction:column!important;gap:0!important;z-index:999;box-shadow:0 4px 12px rgba(0,0,0,.1);margin-left:0!important}
  .nav-links.open{display:flex!important}
  .nav-links a{padding:.65rem .5rem;border-bottom:1px solid #f5f5f5;font-size:.9rem;width:100%}
  .burger-btn{display:flex!important;align-items:center;background:none!important;border:none!important;box-shadow:none!important;outline:none!important;padding:.3rem!important;color:#555!important;font-size:1.3rem;cursor:pointer;margin-left:auto}
  .top-nav .ms-auto:not(.burger-btn){display:none!important}

  /* ── Stat Bar ─────────────────────────────────── */
  .stat-bar{gap:.5rem;padding:.5rem 1rem;flex-wrap:wrap}
  .stat-num{font-size:.95rem}
  .stat-label{font-size:.68rem}

  /* ── Filter Bar ───────────────────────────────── */
  .filter-bar{flex-direction:column;padding:.6rem 1rem;gap:.4rem}
  .filter-bar input,.filter-bar select,.filter-bar button,.filter-bar a{width:100%!important;box-sizing:border-box}
  .total-count{display:none}

  /* ── Admin Card Grid Mobile ───────────────────── */
  /* Horizontal cards: Bild links (82px), Text rechts */
  .ac-grid{grid-template-columns:1fr!important;gap:.35rem!important;padding:.4rem .65rem!important}
  .ac-card{flex-direction:row!important;align-items:stretch!important;border-radius:8px!important}
  .ac-img{width:82px!important;min-width:82px!important;flex:0 0 82px!important;aspect-ratio:1!important}
  .ac-body{padding:.4rem .55rem!important}
  .ac-cat{margin-bottom:.05rem!important;font-size:.65rem!important}
  .ac-title{font-size:.83rem!important;-webkit-line-clamp:2!important}
  .ac-foot{margin-top:.25rem!important;padding-top:.2rem!important;border-top:none!important;font-size:.67rem!important}
  /* Actions immer sichtbar auf Mobile */
  .ac-actions{opacity:1!important;top:.3rem!important;right:.3rem!important}
  /* Kein Hover-Effekt nötig auf Touch */
  .ac-card:hover{box-shadow:none!important}

  /* ── Admin Filter Bar: 2-Zeilen Grid ─────────── */
  .admin-filter-bar{
    flex-direction:row!important;flex-wrap:wrap!important;
    padding:.4rem .65rem!important;gap:.3rem!important;align-items:center!important;
  }
  .admin-filter-bar input[name="q"]{flex:1 1 0!important;width:auto!important;min-width:0!important}
  .admin-filter-bar select{flex:1 1 calc(50% - .15rem)!important;width:auto!important;min-width:0!important}
  .admin-filter-bar .btn-filter:not(.btn-reset){width:auto!important;flex:0 0 auto!important;padding:.3rem .65rem!important}
  .admin-filter-bar .btn-reset{display:none!important}

  /* ── Kategorien Grid → Stack ──────────────────── */
  .kategorien-layout{display:flex!important;flex-direction:column!important;height:auto!important}
  .kategorien-layout > div{border-right:none!important;border-bottom:1px solid #f0f0f0;padding:1rem!important;width:100%!important;height:auto!important;overflow:visible!important}

  /* Kategorien-Liste: kompakte Karten-Zeilen */
  .cat-row{
    position:relative!important;
    padding:.3rem .65rem .3rem .65rem!important;
    padding-right:55px!important;
    flex-wrap:wrap!important;
    gap:0!important;
    align-items:flex-start!important;
  }
  /* Name: volle Breite, kein Wrap */
  .cat-row > span:first-child{
    flex:0 0 100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    min-width:0!important;
    font-size:.84rem!important;
  }
  /* Slug: volle Breite, klein, monospace */
  .cat-slug{
    flex:0 0 100%!important;
    min-width:0!important;
    font-size:.67rem!important;
    color:#ccc!important;
    font-family:monospace!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    margin-top:.05rem!important;
  }
  /* WP-ID: auf Mobile ausblenden */
  .cat-wpid{display:none!important}
  /* Post-Count: absolut rechts */
  .cat-count{
    position:absolute!important;
    right:28px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    font-size:.7rem!important;
    min-width:0!important;
  }
  /* Delete-Button: absolut ganz rechts */
  .cat-row > span:last-child{
    position:absolute!important;
    right:4px!important;
    top:50%!important;
    transform:translateY(-50%)!important;
    width:auto!important;
  }
  /* Header-Zeile: Slug-Spalte ausblenden */
  .kategorien-layout > div:last-child > div:first-child{padding:.3rem .65rem!important}
  .kategorien-layout > div:last-child > div:first-child > span:nth-child(2){display:none!important}
  .kategorien-layout > div:last-child > div:first-child > span:nth-child(4){display:none!important}

  /* ── Links Grid → Stack ───────────────────────── */
  .links-layout{display:flex!important;flex-direction:column!important}
  .links-layout > div{width:100%!important;overflow:visible!important}
  .links-layout .lnk-table-container{overflow-x:auto}
  .lnk-table{min-width:400px}

  /* Links-Karten: kompakt */
  .links-layout .posts-table tr{padding:.35rem .65rem!important}
  .links-layout .posts-table td{padding:.07rem 0!important}

  /* URL-Cell: nie umbrechen */
  .url-cell{
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:.68rem!important;
    color:#ccc!important;
    max-width:100%!important;
  }

  /* Post-Titel in Links-Karte: klein + truncate */
  .links-layout .posts-table td:nth-child(3){
    font-size:.72rem!important;
    color:#aaa!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* ── Assets Grid ──────────────────────────────── */
  .asset-grid{grid-template-columns:repeat(auto-fill,minmax(90px,1fr))!important;padding:.5rem}
  .asset-card{aspect-ratio:1!important}

  /* ── Karte-Tabelle → Mobile Cards ───────────── */
  .show-mobile-only{display:block}
  .karte-table-wrap{overflow-x:visible}
  .karte-table thead{display:none}
  .karte-table,.karte-table tbody,.karte-table tr,.karte-table td{display:block;width:100%}
  .karte-table tr{border:1px solid #f0f0f0;border-radius:8px;margin:.3rem .65rem;padding:.5rem .75rem;background:#fff;position:relative}
  .karte-table td{padding:.15rem 0;border:none}
  .karte-table .col-id{position:absolute;top:.5rem;right:60px;font-size:.68rem;color:#ddd}
  .karte-table .col-act{position:absolute;top:.45rem;right:.5rem;width:auto}
  .karte-table .hide-mobile{display:none!important}

  /* ── Sync ─────────────────────────────────────── */
  .log-row{flex-wrap:wrap;gap:.25rem}

  /* KPI Grid: 3 Spalten statt vertikaler Stack */
  .sync-section .kpi-row{
    padding:.65rem .75rem!important;
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:.45rem .2rem!important;
    align-items:start!important;
  }
  .sync-section .kpi-row .kpi{width:auto!important}
  .kpi-num{font-size:1.25rem!important}
  .kpi-label{font-size:.62rem!important}

  /* Button-Zeile: volle Breite */
  .sync-section .kpi-row>div:last-child{
    grid-column:1/-1!important;
    width:auto!important;
    margin-left:0!important;
    display:flex!important;
    gap:.5rem!important;
  }
  .sync-section .kpi-row>div:last-child .btn-action,
  .sync-section .kpi-row>div:last-child .btn-new{
    flex:1!important;
    justify-content:center!important;
  }

  /* Pending-Rows kompakter */
  .sync-section [style*="padding:.4rem 1.25rem"]{padding:.3rem .65rem!important;gap:.4rem!important}
  .sync-section [style*="padding:.4rem 1.25rem"] a{font-size:.8rem!important}
  .sync-section [style*="padding:.4rem 1.25rem"] span:last-child{font-size:.68rem!important}

  /* ── Editor — Mobile Redesign ─────────────────── */
  .col-md-8,.col-md-4{width:100%!important}
  .row.g-4{display:flex!important;flex-direction:column!important;gap:0!important;--bs-gutter-y:0!important;--bs-gutter-x:0!important}
  .container-fluid.px-4{padding-left:0!important;padding-right:0!important}

  /* Topbar: flach, kein Box-Look */
  .editor-topbar{display:flex!important;align-items:center!important;gap:.35rem!important;padding:.5rem .9rem!important;margin-bottom:0!important;background:#fff!important;border:none!important;border-bottom:1px solid #f0f0f0!important;border-radius:0!important;box-shadow:none!important}
  .editor-topbar>span.text-muted{font-size:.7rem!important;flex:1!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;color:#bbb!important}
  .editor-topbar .ms-auto{display:none!important}
  .editor-topbar .btn,.editor-topbar a.btn{padding:.25rem .5rem!important;font-size:.75rem!important;border-color:#e0e0e0!important}

  /* Topbar (aktuelles Markup): Actions umbrechen statt abschneiden */
  .editor-topbar-inner{flex-wrap:wrap!important;padding:.5rem .9rem!important;gap:.4rem!important}
  .editor-postid{flex:1 1 auto!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}
  .editor-topbar-actions{width:100%!important;margin-left:0!important;justify-content:flex-end!important;flex-wrap:wrap!important;gap:.35rem!important}
  .btn-preview,.status-sel,.btn-push,.btn-save{font-size:.75rem!important;padding:.28rem .55rem!important}

  /* Titel-Input: darf nicht über den Viewport hinausragen */
  .editor-title-area{padding:1rem .9rem .5rem!important}
  .editor-title-input{font-size:1.2rem!important}

  /* Cards → flache Sektionen */
  body.has-editor .card{display:block!important;border:none!important;border-bottom:1px solid #f0f0f0!important;border-radius:0!important;box-shadow:none!important;padding:.65rem .9rem!important;margin-bottom:0!important;background:#fff!important}
  body.has-editor .col-md-8>.card:last-of-type,
  body.has-editor .col-md-4>.card:last-of-type{border-bottom:none!important}

  /* Labels — immer Block über dem Feld */
  body.has-editor .form-label,
  body.has-editor .fw-semibold.small.text-muted{display:block!important;font-size:.65rem!important;color:#bbb!important;text-transform:uppercase!important;letter-spacing:.06em!important;font-weight:600!important;margin-bottom:.3rem!important}

  /* Inputs */
  body.has-editor .form-control,
  body.has-editor .form-select{display:block!important;width:100%!important;border:1px solid #ebebeb!important;border-radius:6px!important;padding:.38rem .55rem!important;font-size:.86rem!important;background:#fff!important;color:#111!important;box-shadow:none!important}
  body.has-editor .form-control:focus,
  body.has-editor .form-select:focus{border-color:#aaa!important;box-shadow:none!important;outline:none!important}

  /* Titel — borderlos, groß */
  body.has-editor input[name="title"]{border:none!important;border-radius:0!important;font-size:1.1rem!important;font-weight:700!important;padding:.1rem 0!important;width:100%!important}

  /* Slug-Zeile */
  body.has-editor .d-flex.align-items-center.gap-2.mt-2{margin-top:.4rem!important;gap:.3rem!important;flex-wrap:nowrap!important}
  body.has-editor .d-flex.align-items-center.gap-2.mt-2>span{font-size:.7rem!important;color:#ccc!important;white-space:nowrap!important}
  body.has-editor .d-flex.align-items-center.gap-2.mt-2 input[name="slug"]{font-family:monospace!important;font-size:.76rem!important;flex:1!important;min-width:0!important}
  body.has-editor .d-flex.align-items-center.gap-2.mt-2 .btn{padding:.2rem .45rem!important;font-size:.72rem!important;white-space:nowrap!important;border-color:#e0e0e0!important;color:#999!important}

  /* Content Textarea */
  #content-editor{min-height:190px!important;height:190px!important;border:none!important;border-radius:0!important;padding:0!important;width:100%!important;font-size:.79rem!important;line-height:1.5!important;font-family:monospace!important;resize:vertical!important;color:#333!important}

  /* Excerpt / SEO */
  textarea[name="excerpt"]{min-height:55px!important;height:55px!important;resize:vertical!important}
  textarea[name="seo_desc"]{min-height:55px!important;height:55px!important;resize:vertical!important}
  body.has-editor .row.g-2{--bs-gutter-y:.35rem!important}

  /* Sidebar-Felder */
  body.has-editor .col-md-4 .card .mb-3{margin-bottom:.45rem!important}
  body.has-editor .col-md-4 .card .mb-1{margin-bottom:.1rem!important}

  /* Featured Image */
  #fi-preview img{max-height:90px!important;border-radius:4px!important}
  #fi-preview .bg-light{padding:.4rem!important;font-size:.72rem!important;border-radius:4px!important;color:#bbb!important}
  body.has-editor .btn-sm.w-100{padding:.32rem!important;font-size:.78rem!important}

  /* Link-Matrix */
  #link-results{max-height:130px!important}
  #link-search{padding:.32rem .5rem!important;font-size:.83rem!important}

  /* Sticky Save Bar */
  .editor-sticky-bar{display:flex!important;background:#fff!important;border-top:1px solid #f0f0f0!important;box-shadow:none!important;padding:.5rem .9rem!important;gap:.5rem!important}
  .editor-sticky-bar .form-select{width:100px!important;font-size:.82rem!important;border-radius:6px!important;border-color:#e0e0e0!important}
  .editor-sticky-bar .btn-new{font-size:.9rem!important;flex:1!important;justify-content:center!important}
  body.has-editor{padding-bottom:56px!important}

  /* ── Export / Import ──────────────────────────── */
  .panel a,.panel button{display:block;width:100%!important;text-align:center;box-sizing:border-box}

  /* ── Pagination ───────────────────────────────── */
  .pagination-bar{padding:.4rem;gap:.2rem}
  .pg-btn{min-width:28px;height:28px;font-size:.75rem}

  /* ── Links-Tabelle Suche ──────────────────────── */
  div[style*="grid-template-columns:280px"]{display:flex!important;flex-direction:column!important}
  div[style*="grid-template-columns:300px"]{display:flex!important;flex-direction:column!important}
  div[style*="height:calc(100vh"]{height:auto!important;overflow:visible!important}
  div[style*="overflow-y:auto"]{overflow:visible!important;height:auto!important}
}

/* ── Floating Edit Button (View-Seite Mobile) ──── */
.cz-edit-fab{display:none}
@media(max-width:768px){
  .cz-edit-fab{
    display:flex;align-items:center;gap:.4rem;
    position:fixed;bottom:1.1rem;right:1rem;z-index:500;
    background:#111;color:#fff;border-radius:50px;
    padding:.55rem 1.1rem;font-size:.88rem;font-weight:500;
    text-decoration:none;box-shadow:0 3px 12px rgba(0,0,0,.22);
  }
}

/* ── Frontend Blog Grid Mobile ────────────────── */
@media(max-width:768px){
  /* Filter kompakter */
  .cz-filter{padding:.4rem .65rem!important;gap:.25rem!important;flex-wrap:nowrap!important}
  .cz-filter form{gap:.25rem!important;flex-wrap:nowrap!important;align-items:center!important}
  .cz-filter input{width:auto!important;flex:1!important;min-width:0!important;font-size:.8rem!important}
  .cz-filter select{flex:0 1 auto!important;min-width:0!important;max-width:38%!important;font-size:.78rem!important;padding:.28rem .3rem .28rem .5rem!important}
  .cz-filter button{flex:0 0 auto!important;white-space:nowrap!important;font-size:.78rem!important;padding:.28rem .55rem!important}
  .cz-count{font-size:.7rem!important;white-space:nowrap!important;flex-shrink:0!important}

  /* Grid: 1 Spalte, enge Gaps */
  .cz-grid{grid-template-columns:1fr!important;gap:.35rem!important;padding:.4rem .65rem!important}

  /* Karte: horizontal — kleines Bild links, Text rechts */
  .cz-card{flex-direction:row!important;align-items:stretch!important;border-radius:8px!important}
  .cz-card-img{
    width:82px!important;min-width:82px!important;flex:0 0 82px!important;
    aspect-ratio:1!important;border-radius:0!important;
  }
  .cz-card-body{padding:.4rem .55rem!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important}
  .cz-card-cat{margin-bottom:.05rem!important;font-size:.67rem!important}
  .cz-card-title{font-size:.82rem!important;margin-bottom:0!important;line-height:1.3!important;
    display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important}
  .cz-card-excerpt{display:none!important}
  .cz-card-foot{margin-top:auto!important;padding-top:.2rem!important;border-top:none!important;font-size:.67rem!important}
}

/* ── Frontend Post View Mobile ─────────────────── */
@media(max-width:768px){
  /* 9:16 Slider: 2 Karten statt 4 */
  .cz-slider-card{flex:0 0 calc(50% - 5px)!important}
  .cz-slider-track{gap:8px!important}

  /* Seitenabstand */
  .cz-content,.entry-content{padding:0 .75rem!important}
  .cz-post-layout{padding:0 0 2rem!important}
  .cz-article{padding:0 .75rem}
  .cz-tags{padding-left:0;padding-right:0}

  /* Hero: kürzer + kein Radius */
  .cz-hero{
    margin-left:-.75rem;margin-right:-.75rem;
    border-radius:0!important;
    max-height:210px!important;margin-bottom:1rem!important;
  }
  .cz-hero img{max-height:210px!important}

  /* Titel: kleiner */
  .cz-title{font-size:1.4rem!important;line-height:1.22!important;margin-bottom:.6rem!important}

  /* Lead: kompakter */
  .cz-lead{font-size:.9rem!important;margin-bottom:1rem!important;padding-bottom:1rem!important}

  /* Breadcrumb aus WP-Content: verstecken */
  .cz-content [class*="breadcrumb"],
  .cz-content .av-breadcrumbs-container,
  .cz-content .breadcrumb_prefix,
  .cz-content [class*="av-breadcrumb"]{display:none!important}

  /* Zuletzt-aktualisiert: kompakter */
  .cz-content div:has(> svg){margin:.15rem 0 .75rem!important}
}

/* ── Targeted Overflow Fixes (via Puppeteer) ──── */
@media(max-width:768px){
  /* admin: table + slug */
  .posts-table{width:100%!important;table-layout:fixed!important;overflow:hidden!important}
  .posts-table tr{overflow:hidden!important;max-width:calc(100vw - 1.5rem)!important}
  .post-slug{max-width:calc(100vw - 6rem)!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;display:block!important}

  /* assets: filename */
  .fn,.asset-card .fn{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important}

  /* sync: links overflow */
  .sync-section a,.log-row a,.sync-row a{max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;display:inline-block!important}
  .sync-section .panel{overflow:hidden!important}
  .kpi-row{flex-wrap:wrap!important;gap:.75rem!important}

  /* global overflow trap */
  body{overflow-x:hidden!important}
  .container-fluid{max-width:100vw!important;overflow-x:hidden!important}
}

/* ── Viewport Expansion verhindern ───────────────── */
@media(max-width:768px){
  html{max-width:100%;overflow-x:hidden}
  body{max-width:100%;overflow-x:hidden;width:100%}
  *{max-width:100%;box-sizing:border-box}
  img,iframe,table,pre{max-width:100%!important}

  /* Kategorien: force stack */
  .kategorien-layout{display:block!important;width:100%!important}
  .kategorien-layout > *{display:block!important;width:100%!important;min-width:0!important;height:auto!important;max-width:100%!important;border-right:none!important}

  /* Assets: filter bar constraint */
  .asset-grid{max-width:100%!important}
  .topbar,.topbar form,.topbar *{max-width:100%!important;box-sizing:border-box}
  .topbar{flex-wrap:wrap!important;padding:.5rem .75rem!important}
  .topbar input,.topbar select{width:100%!important}
  .topbar label.btn-new{width:100%!important;justify-content:center!important}
}
