/*
Theme Name: DITTEC Maschinen
Theme URI: https://www.dittec.de/
Author: DITTEC
Description: Maschinen-Verwaltung fuer dittec.de. Custom Post Type "Maschine" mit Uebersicht, Detailseiten und traktorpool-Seite im Design der bestehenden Website.
Version: 1.0
Requires at least: 6.0
Requires PHP: 8.0
Text Domain: dittec
*/

:root{
  --ink:#2E2E30; --ink-soft:#3A3A3C; --muted:#6B6B6E; --muted-2:#85847F; --faint:#9C9B96;
  --green:#6D8F24; --green-dark:#55701B; --lime:#A1D138; --lime-dark:#8FBE2B;
  --sand:#F7F6F1; --line:#E7E5DE; --line-2:#D9D7CF; --dark:#2C2C2E;
  --wrap:1280px;
}

*{box-sizing:border-box}
html{overflow-y:scroll;scrollbar-gutter:stable;scroll-behavior:smooth}
body{margin:0;font-family:'Archivo',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--ink);background:#fff;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:var(--green);text-decoration:none}
a:hover{color:var(--green-dark)}
img{max-width:100%}
::selection{background:#DCEEAE}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}html{scroll-behavior:auto}}

.dt-wrap{max-width:var(--wrap);margin:0 auto;padding:0 32px}
.dt-sec{padding:76px 0}
.dt-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.dt-eyebrow span:first-child{width:22px;height:3px;background:var(--lime);border-radius:2px}
.dt-eyebrow span:last-child{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}
h1,h2,h3{letter-spacing:-.02em;color:var(--ink);text-wrap:pretty;margin:0}
.dt-h1{font-size:clamp(44px,5.6vw,68px);font-weight:800;line-height:1.02;max-width:820px}
.dt-h2{font-size:36px;font-weight:800}
.dt-lead{margin:0;font-size:15px;line-height:1.6;color:var(--muted);max-width:360px;text-wrap:pretty}

/* Header */
.dt-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.dt-head{height:72px;display:flex;align-items:center;gap:28px}
.dt-head img{height:30px;display:block}
.dt-nav{display:flex;align-items:center;gap:22px;flex:1;min-width:0}
.dt-nav a{font-size:14.5px;font-weight:600;color:var(--ink-soft)}
.dt-nav a:hover{color:var(--green)}
.dt-nav a.is-secondary{font-size:14px;font-weight:500;color:var(--muted)}
.dt-nav a.is-secondary:hover{color:var(--ink-soft)}
.dt-nav a.is-active{color:var(--green)}
.dt-nav .dt-num{font-family:ui-monospace,Menlo,monospace;font-size:10px;color:var(--lime);margin-right:7px}
.dt-nav-sep{width:1px;height:18px;background:var(--line)}
.dt-headact{display:flex;align-items:center;gap:16px;flex:none}
.dt-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:6px;color:var(--ink);border:1.5px solid var(--line-2)}
.dt-icon:hover{border-color:var(--ink)}
.dt-btn{display:inline-block;background:var(--lime);color:var(--ink);font-size:14.5px;font-weight:600;padding:11px 20px;border-radius:6px;white-space:nowrap;border:none;cursor:pointer;font-family:inherit}
.dt-btn:hover{background:var(--lime-dark);color:var(--ink)}
.dt-btn-dark{background:var(--ink);color:#fff}
.dt-btn-dark:hover{background:#1E1E20;color:#fff}
.dt-btn-ghost{background:#fff;color:var(--ink-soft);border:1.5px solid var(--line-2);font-weight:600;padding:11px 20px;border-radius:6px;cursor:pointer;font-family:inherit;font-size:14.5px}
.dt-btn-ghost:hover{border-color:var(--ink-soft)}

/* Karten-Raster */
.dt-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}
.dt-card{background:#fff;border:1px solid var(--line);border-radius:12px;overflow:hidden;display:flex;flex-direction:column;color:var(--ink);transition:border-color .15s,transform .15s,box-shadow .15s}
.dt-card:hover{border-color:var(--lime);transform:translateY(-4px);box-shadow:0 18px 40px rgba(46,46,48,.12);color:var(--ink)}
.dt-card-media{position:relative;height:200px;background:#EDF0E4;overflow:hidden}
.dt-card-media img{width:100%;height:100%;object-fit:cover;display:block}
.dt-nophoto{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:repeating-linear-gradient(135deg,#EDF0E4 0 12px,#E7EBDC 12px 24px);font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.14em;color:#9DAE79}
.dt-tag{position:absolute;top:12px;left:12px;background:rgba(46,46,48,.86);color:#F4F3EE;font-family:ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.1em;padding:5px 10px;border-radius:5px}
.dt-status{position:absolute;top:12px;right:12px;font-family:ui-monospace,Menlo,monospace;font-size:10px;letter-spacing:.1em;padding:5px 10px;border-radius:5px;background:#fff;color:var(--green-dark);border:1px solid var(--line)}
.dt-status.is-reserviert{background:#FDF3D9;color:#8A6A12;border-color:#EBD79A}
.dt-status.is-verkauft{background:#EFEFEF;color:#6B6B6E;border-color:#DCDCDC}
.dt-card-body{padding:18px 18px 20px;display:flex;flex-direction:column;flex:1}
.dt-cond{font-family:ui-monospace,Menlo,monospace;font-size:10.5px;letter-spacing:.08em;color:var(--green);margin-bottom:8px}
.dt-card-title{font-size:18px;font-weight:700;letter-spacing:-.01em;line-height:1.25;margin-bottom:4px}
.dt-specs{font-size:13px;color:var(--muted-2);margin-bottom:12px}
.dt-price{font-size:22px;font-weight:800;margin:6px 0 12px}
.dt-desc{font-size:14px;line-height:1.55;color:var(--muted);margin-bottom:16px;text-wrap:pretty}
.dt-more{margin-top:auto;font-size:13.5px;font-weight:600;color:var(--green)}

/* Filter */
.dt-filters{display:flex;flex-wrap:wrap;gap:8px;margin:26px 0 6px}
.dt-chip{font-family:inherit;font-size:13.5px;font-weight:600;padding:9px 16px;border-radius:20px;border:1.5px solid var(--line-2);background:#fff;color:var(--ink-soft);cursor:pointer}
.dt-chip .dt-count{opacity:.6;font-family:ui-monospace,Menlo,monospace;font-size:11px}
.dt-chip.is-active{border-color:var(--lime);background:#F1F6E3;color:var(--green-dark)}

.dt-empty{margin-top:36px;border:1.5px dashed var(--line-2);border-radius:14px;padding:64px 24px;text-align:center}
.dt-empty strong{display:block;font-size:19px;color:var(--ink-soft);margin-bottom:8px}
.dt-empty p{margin:0 0 22px;font-size:15px;color:var(--muted)}

/* Pagination */
.dt-pager{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:40px}
.dt-pager a,.dt-pager span{min-width:40px;height:40px;padding:0 12px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;border:1.5px solid var(--line-2);background:#fff;color:var(--ink-soft);font-size:14.5px;font-weight:700}
.dt-pager .current{border-color:var(--lime);background:#F1F6E3;color:var(--green-dark)}

/* Detailseite */
.dt-detail{display:grid;grid-template-columns:1.1fr .9fr;gap:48px;align-items:start}
.dt-gallery-main{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#EDF0E4;aspect-ratio:4/3}
.dt-gallery-main img{width:100%;height:100%;object-fit:cover;display:block}
.dt-thumbs{display:flex;gap:10px;margin-top:12px;flex-wrap:wrap}
.dt-thumbs button{width:84px;height:64px;border-radius:8px;overflow:hidden;border:1.5px solid var(--line-2);background:none;padding:0;cursor:pointer}
.dt-thumbs button.is-active{border-color:var(--lime)}
.dt-thumbs img{width:100%;height:100%;object-fit:cover;display:block}
.dt-speclist{margin:22px 0 0;padding:0;list-style:none;border-top:1px solid var(--line)}
.dt-speclist li{display:grid;grid-template-columns:200px 1fr;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px;line-height:1.55}
.dt-speclist b{font-weight:700;color:var(--green-dark);font-size:13px}
.dt-note{font-size:12.5px;color:var(--faint);line-height:1.5;margin-top:20px}

/* Formular */
.dt-form{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.dt-form label{display:block;font-size:12px;font-weight:700;color:var(--ink-soft);margin-bottom:5px}
.dt-form input,.dt-form textarea,.dt-form select{width:100%;font-family:inherit;font-size:14.5px;color:var(--ink);border:1.5px solid var(--line-2);border-radius:8px;padding:10px 12px;background:#fff}
.dt-form textarea{line-height:1.5;resize:vertical}
.dt-form input:focus,.dt-form textarea:focus{border-color:var(--lime);outline:none}
.dt-form-2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.dt-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dt-ok{font-size:13.5px;font-weight:600;color:var(--green-dark);background:#EFF6DC;border-radius:8px;padding:11px 13px;line-height:1.5}
.dt-err{font-size:13.5px;font-weight:600;color:#C0392B;background:#FDECEA;border-radius:8px;padding:11px 13px;line-height:1.5}

/* traktorpool */
.dt-embed{margin-top:16px;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff;box-shadow:0 10px 28px rgba(46,46,48,.08)}
.dt-embed iframe{width:100%;height:1400px;border:0;display:block}
.dt-embed-gate{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:72px 34px;text-align:center;background:linear-gradient(0deg,#EFEDE6,#F7F6F1)}
.dt-live{display:inline-flex;align-items:center;gap:8px;font-family:ui-monospace,Menlo,monospace;font-size:11.5px;letter-spacing:.1em;color:var(--green)}
.dt-live i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 4px rgba(161,209,56,.2)}

/* Footer */
.dt-footer{background:var(--dark);border-top:1px solid #4A4A4D}
.dt-foot{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:48px;padding:56px 32px 40px}
.dt-foot-h{font-family:ui-monospace,Menlo,monospace;font-size:11px;letter-spacing:.14em;color:var(--muted-2);margin-bottom:16px}
.dt-foot a{font-size:14px;color:#C9C8C3}
.dt-foot a:hover{color:var(--lime)}
.dt-foot-col{display:flex;flex-direction:column;align-items:flex-start;gap:10px}
.dt-foot p{font-size:14px;line-height:1.6;color:var(--faint);margin:0}
.dt-foot-bottom{border-top:1px solid #3F3F42}
.dt-foot-bottom > div{max-width:var(--wrap);margin:0 auto;padding:20px 32px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.dt-foot-bottom span,.dt-foot-bottom a{font-size:13px;color:var(--faint)}
.dt-foot-bottom a:hover{color:#C9C8C3}
.dt-foot-icon{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:8px;color:#C9C8C3;border:1.5px solid #4A4A4D}

/* Bereiche-Dropdown */
.dt-drop{position:relative;display:inline-flex;padding:12px 0;margin:-12px 0}
.dt-drop-label{font-size:14.5px;font-weight:600;color:var(--ink-soft);display:inline-flex;align-items:center;gap:7px;cursor:default;white-space:nowrap}
.dt-caret{font-size:9px;color:var(--lime)}
.dt-drop-panel{display:none;position:absolute;top:100%;left:-14px;background:#fff;border:1px solid var(--line);border-radius:8px;box-shadow:0 16px 40px rgba(46,46,48,.14);padding:8px;flex-direction:column;min-width:240px;z-index:80}
.dt-drop:hover .dt-drop-panel,.dt-drop:focus-within .dt-drop-panel{display:flex}
.dt-drop-panel a{display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:6px;font-size:14.5px;font-weight:600;color:var(--ink-soft);white-space:nowrap}
.dt-drop-panel a:hover{background:var(--sand);color:var(--green)}
.dt-nav a.is-secondary{white-space:nowrap}

/* Mobilnavigation */
.dt-mobilenav{display:none;gap:18px;overflow-x:auto;padding:0 18px 12px;border-bottom:1px solid var(--line);-webkit-overflow-scrolling:touch}
.dt-mobilenav a{font-size:14px;font-weight:600;color:var(--ink-soft);white-space:nowrap}
.dt-mobilenav a:hover{color:var(--green)}

@media (max-width:1000px){.dt-nav{display:none}.dt-mobilenav{display:flex}}
@media (max-width:1000px){.dt-grid{grid-template-columns:repeat(2,1fr)}.dt-detail{grid-template-columns:1fr;gap:32px}.dt-wrap{padding:0 24px}}
@media (max-width:900px){.dt-headcta{display:none}}
@media (max-width:640px){
  .dt-wrap{padding:0 18px}.dt-sec{padding:56px 0}
  .dt-grid{grid-template-columns:1fr}
  .dt-h1{font-size:42px}.dt-h2{font-size:28px}
  .dt-foot{grid-template-columns:1fr 1fr;gap:32px}
  .dt-foot-brand{grid-column:1/-1}
  .dt-lead{max-width:none;text-align:left}
  .dt-speclist li{grid-template-columns:1fr;gap:2px}
  .dt-form-2{grid-template-columns:1fr}
  .dt-form input,.dt-form textarea,.dt-form select{font-size:16px;min-height:48px}
}