/* MyCompany Frontend Styles (M3 Branding) */
:root{--m3-blue:#1858aa;--m3-green:#00a32a;--m3-orange:#f58220;--m3-gray:#444444;--m3-black:#000;--m3-white:#fff}

/* Material Symbols utility (global) */
.ms{
  font-family:"Material Symbols Outlined";
  font-weight:normal;
  font-style:normal;
  font-size:18px; /* default size, can be overridden */
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  direction:ltr;
  -webkit-font-feature-settings:"liga";
  font-feature-settings:"liga";
  -webkit-font-smoothing:antialiased;
  font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;
}

/* Google recommended class name for Material Symbols */
.material-symbols-outlined{
  font-family:"Material Symbols Outlined";
  font-weight:normal;
  font-style:normal;
  font-size:18px; /* default size */
  line-height:1;
  letter-spacing:normal;
  text-transform:none;
  display:inline-block;
  white-space:nowrap;
  direction:ltr;
  -webkit-font-feature-settings:"liga";
  font-feature-settings:"liga";
  -webkit-font-smoothing:antialiased;
  font-variation-settings:
    'FILL' 0,
    'wght' 400,
    'GRAD' 0,
    'opsz' 24;
}

/* Booking */
.mycompany-booking{border:1px solid #e5e7eb;padding:16px;border-radius:8px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06);margin-top:20px}
.mycompany-booking .m3-steps ul { list-style: none; margin-left: 0; padding: 0; }
.mycompany-booking input[name="booking_date"].is-closed {
  background-color: #eeeeee;
  color: #666666;
  border-color: #cccccc;
}
.mycompany-booking .m3-layout{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width: 980px){
  .mycompany-booking .m3-layout{grid-template-columns: minmax(0,1fr) 340px;align-items:start}
}
.mycompany-booking .m3-sidebar{border-left:0;padding-left:0;align-self:start;display:flex;flex-direction:column;min-height:100%}
@media (min-width: 980px){
  .mycompany-booking .m3-sidebar{border-left:1px solid #e5e7eb;padding-left:16px;position:sticky;top:0}
}
.mycompany-booking .m3-side-header{display:flex;align-items:center;justify-content:center;padding:6px 0 12px 0}
.mycompany-booking .m3-summary{background:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;padding:12px;flex:1}
.mycompany-booking .m3-summary h4{margin:0 0 8px 0;color:#111}
.mycompany-booking .m3-overview{font-size:13px;color:#333;display:grid;gap:6px}
.mycompany-booking .m3-totals{display:grid;gap:6px;margin-top:10px;font-size:14px}
.mycompany-booking .m3-totals > div{display:flex;align-items:center;justify-content:space-between}
.mycompany-booking .m3-totals strong{font-weight:600;color:#111}
.mycompany-booking .m3-totals .m3-total-price,.mycompany-booking .m3-totals .m3-total-duration{font-weight:700;color:var(--m3-orange)}
.mycompany-booking .m3-dept-phone,.mycompany-booking .m3-dept-email{margin-top:4px}
.mycompany-booking .m3-side-footer{font-size:14px;color:#333;margin-top:10px;border-top:1px solid #e5e7eb;padding-top:10px}
.mycompany-booking .m3-dept-name{font-weight:600;color:#111;margin-bottom:2px}
.mycompany-booking .m3-main .m3-step{background:#fff;border:1px solid #e5e7eb;border-radius:8px;padding:12px;margin-bottom:12px;margin-top:12px}
/* Step 5 grid */
.mycompany-booking .m3-grid{display:grid;grid-template-columns:1fr;gap:12px 16px}
@media (min-width: 720px){
  .mycompany-booking .m3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.mycompany-booking .m3-col-12{grid-column:1/-1}
.mycompany-booking .m3-grid .m3-col input,
.mycompany-booking .m3-grid .m3-col select,
.mycompany-booking .m3-grid .m3-col textarea{width:100%;padding:8px 10px;border:1px solid #d1d5db;border-radius:6px}
.mycompany-booking .m3-grid .m3-legal{display:flex;flex-wrap:nowrap;gap:14px;align-items:center}
.mycompany-booking .m3-grid .m3-legal label{font-weight:500;font-size:13px;display:flex;align-items:center;gap:6px;margin:0;white-space:nowrap}
.mycompany-booking .m3-grid .m3-legal input[type="checkbox"]{transform:scale(0.9)}
/* Plate inputs */
.mycompany-booking select[name="plate_canton"]{min-width:64px;width:auto}
.mycompany-booking input[name="plate_number"]{width:200px;max-width:240px}
.mycompany-booking .m3-over-datetime{font-weight:700;margin:8px 0}
.mycompany-booking .m3-item{position:relative;padding:12px;border:1px solid #e3e6ea;border-radius:12px;background:#fff;margin-bottom:10px;box-shadow:0 1px 1px rgba(0,0,0,.02);transition:border-color .15s ease, box-shadow .15s ease, background .15s ease}
.mycompany-booking .m3-item:hover{border-color:#cfd6df;box-shadow:0 2px 8px rgba(0,0,0,.05)}
.mycompany-booking .m3-item label{display:flex;gap:12px;align-items:flex-start;justify-content:space-between;cursor:pointer}
.mycompany-booking .m3-item .m3-text{flex:1;min-width:0}
.mycompany-booking .m3-item .m3-title-row{display:flex;align-items:center;gap:10px}
.mycompany-booking .m3-item .m3-title-row .price{margin-left:auto}
.mycompany-booking .m3-item input[type="checkbox"],
.mycompany-booking .m3-item input[type="radio"]{position:absolute;opacity:0;pointer-events:none}
.mycompany-booking .m3-item.is-selected{border-color:var(--m3-green);background:#f5fff7;box-shadow:0 0 0 2px rgba(0,163,42,.15)}
.mycompany-booking .m3-item.is-disabled{opacity:.5;filter:grayscale(0.2)}
.mycompany-booking .m3-item strong{font-weight:700;color:#0f172a}
.mycompany-booking .m3-item .price{margin-left:auto;font-weight:700;color:var(--m3-green)}
.mycompany-booking .m3-item .m3-thumb{width:68px;height:68px;object-fit:cover;border-radius:10px;background:#f3f4f6;padding:4px}
.mycompany-booking .m3-item .m3-desc{margin:6px 0 0 0;font-size:12px;color:#555;font-weight:400;display:-webkit-box;-webkit-line-clamp:3;line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;max-height:3.9em}
.mycompany-booking .m3-summary .m3-over-datetime{font-weight:700;margin:8px 0}
.mycompany-booking .m3-item:hover .m3-desc{max-height:none;-webkit-line-clamp:unset;line-clamp:unset}
.mycompany-booking .m3-actions{position:sticky;bottom:0;background:#fff;padding:8px;border-top:1px solid #e5e7eb;border-radius:0 0 8px 8px}
.mycompany-booking h3{margin-top:0;color:var(--m3-green)}
.m3-steps ul{display:flex;gap:12px;list-style:none;padding:0;margin:0 0 12px 0;flex-wrap:wrap}
.m3-steps li{background:#f6f8fa;color:#111;padding:6px 10px;border-radius:999px;font-size:13px;border:1px solid #e5e7eb}
.m3-booking-form .m3-step{display:none}
.m3-booking-form label{display:block;margin:.5rem 0 .25rem;font-weight:600}
.m3-booking-form input, .m3-booking-form select{width:100%;max-width:420px;padding:8px 10px;border:1px solid #d1d5db;border-radius:6px}
.m3-actions{display:flex;gap:8px;margin-top:12px}
.m3-actions .m3-prev,.m3-actions .m3-next,.m3-actions .m3-submit{appearance:none;border:none;border-radius:6px;padding:10px 14px;cursor:pointer;color:#fff;background:var(--m3-green)}
.m3-actions .m3-prev{background:#6b7280}
.m3-actions .m3-submit{background:var(--m3-green)}
.m3-summary{margin-top:14px;padding:12px;border:1px dashed #d1d5db;border-radius:6px;background:#fafafa}
.m3-totals{display:flex;gap:16px;font-weight:700;color:var(--m3-orange)}
.m3-items-list h4{margin:12px 0 6px;color:var(--m3-blue)}
.m3-item{display:inline-block;margin:4px 8px 4px 0}

/* Accordion for services/packages/options */
.m3-acc{border:1px solid #e5e7eb;border-radius:10px;background:#fff;margin:8px 0;overflow:hidden}
.m3-acc > summary{list-style:none;cursor:pointer;padding:10px 12px;background:#f6f8fa;border-bottom:1px solid #e5e7eb}
.m3-acc[open] > summary{background:#eef2f7}
.m3-acc > summary::-webkit-details-marker{display:none}
.m3-acc .m3-list-grid{padding:10px;display:grid;grid-template-columns:1fr;gap:12px}
@media (min-width: 720px){
  .m3-acc .m3-list-grid{grid-template-columns:repeat(2, minmax(0,1fr))}
}

/* Vehicles */
.mycompany-vehicles{margin:10px 0}
.m3-vehicle-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:12px;align-items:flex-end}
.m3-vehicle-filters label{font-size:13px;color:#111}
.m3-vehicle-filters select,.m3-vehicle-filters input{padding:6px 8px;border:1px solid #d1d5db;border-radius:6px}
.mycompany-vehicles-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}

/* Vehicle Sales Listing (frontend) */
.m3v-wrap{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:16px;align-items:start}
@media(max-width: 980px){.m3v-wrap{grid-template-columns:1fr}}
.m3v-main{min-width:0}
.m3v-side{min-width:0}
@media(min-width: 981px){.m3v-side{position:sticky;top:12px}}

/* 3-column grid for vehicles */
.m3v-grid{display:grid;grid-template-columns:repeat(3, minmax(0,1fr));gap:14px}
@media(max-width: 1200px){.m3v-grid{grid-template-columns:repeat(2, minmax(0,1fr))}}
@media(max-width: 720px){.m3v-grid{grid-template-columns:1fr}}

/* Sort/Filter titles consistency */
.m3v-sort label,.m3v-filter-title{font-size:16px;font-weight:600}
.m3v-sort .m3v-sort-reset{font-size:12px;background:none;border:0;padding:0;margin:0;text-decoration:underline;color:#111827}
.m3v-sort{margin-top:10px}
.m3v-filter{margin-top:6px}
.m3-vehicle-card{background:#fff;border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;box-shadow:0 1px 2px rgba(0,0,0,.05);padding:10px}
.m3-thumb img{width:100%;height:auto;display:block;border-radius:6px}
.m3-title{font-size:16px;margin:8px 0}
.m3-title a{color:#111;text-decoration:none}
.m3-title a:hover{color:var(--m3-blue)}
.m3-price{font-weight:700;color:var(--m3-green)}

/* Modal */
.m3-modal{position:fixed;inset:0;display:none}
.m3-modal.is-open{display:block}
.m3-modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.m3-modal-content{position:relative;max-width:880px;margin:40px auto;background:#fff;border-radius:10px;overflow:auto;max-height:85vh;padding:16px}
.m3-modal-close{position:absolute;top:8px;right:8px;background:transparent;border:none;font-size:28px;line-height:1;cursor:pointer}
.m3-gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px;margin-top:8px}
.m3-gallery img{width:100%;height:auto;border-radius:6px}

/* Utilities */
@media (max-width:600px){
  .m3-booking-form input,.m3-booking-form select{max-width:100%}
  .m3-modal-content{margin:10px}
}

/* Cookie footer link (subtle) */
.m3-cookie-open{background:none;border:none;color:#6b7280;font-size:12px;cursor:pointer;margin:16px auto 0;display:block;text-decoration:underline}
.m3-cookie-open:hover{color:var(--m3-blue)}

/* FAQ Accordion */
.m3-faq{border:1px solid #e5e7eb;border-radius:8px;background:#fff}
.m3-faq-item+.m3-faq-item{border-top:1px solid #e5e7eb}
.m3-faq-q{width:100%;text-align:left;background:#f9fafb;border:0;padding:12px 14px;font-weight:600;cursor:pointer}
.m3-faq-a{padding:12px 14px;display:none}
.m3-faq-item.is-open .m3-faq-a{display:block}

/* Before/After Slider */
.m3-ba{position:relative;max-width:900px;margin:12px 0;border-radius:8px;overflow:hidden;border:1px solid #e5e7eb}
.m3-ba img{display:block;width:100%;height:auto}
.m3-ba-after{position:absolute;inset:0;overflow:hidden}
.m3-ba-after img{position:absolute;left:0;top:0;height:100%;width:100%;object-fit:cover}
.m3-ba-divider{position:absolute;top:0;bottom:0;width:3px;background:var(--m3-orange);left:50%;cursor:ew-resize}
.m3-ba-handle{position:absolute;top:50%;left:calc(50% - 14px);transform:translateY(-50%);width:28px;height:28px;border-radius:50%;background:var(--m3-blue);color:#fff;display:flex;align-items:center;justify-content:center;font-size:14px}
.m3-ba-caption{padding:8px 10px;background:#fff;color:#111}

/* Vehicle badges */
.m3-badges{margin:6px 0;display:flex;gap:6px;flex-wrap:wrap}
.m3-badge{display:inline-block;padding:2px 8px;border-radius:999px;font-size:12px;line-height:1.6}
.m3-badge-sold{background:#ef4444;color:#fff}
.m3-badge-promo{background:#f59e0b;color:#111}
.m3-badge-top{background:#10b981;color:#fff}

/* Alerts */
.m3-alert{border-radius:6px;padding:10px 12px;margin:10px 0;font-size:14px;line-height:1.4}
.m3-alert-success{background:#ecfdf5;color:#065f46;border:1px solid #a7f3d0}
.m3-alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.m3-form-messages{margin-bottom:8px}

/* Purchases (Ankauf) Public Page */
.m3-purchase-public{border:1px solid #e5e7eb;padding:16px;border-radius:8px;background:#fff;box-shadow:0 1px 2px rgba(0,0,0,.06);margin-top:20px;margin-bottom:12px}
.m3-purchase-public .m3-layout{display:grid;grid-template-columns:1fr;gap:18px}
@media (min-width: 980px){
  .m3-purchase-public .m3-layout{grid-template-columns:minmax(0,1fr) 340px;align-items:start}
}
.m3-purchase-public .m3-sidebar{border-left:0;padding-left:0;align-self:start;display:flex;flex-direction:column;min-height:100%}
@media (min-width: 980px){
  .m3-purchase-public .m3-sidebar{border-left:1px solid #e5e7eb;padding-left:16px;position:sticky;top:0}
}
.m3-purchase-public h3{margin-top:0;color:var(--m3-green)}
.m3-purchase-public .m3-subtitle{margin:4px 0 12px;color:#111;font-weight:500}
.m3-purchase-public .m3-purchase-form label{display:block;margin:.5rem 0 .25rem;font-weight:600}
.m3-purchase-public .m3-purchase-form input,
.m3-purchase-public .m3-purchase-form select,
.m3-purchase-public .m3-purchase-form textarea{width:100%;max-width:520px;padding:8px 10px;border:1px solid #d1d5db;border-radius:6px}
.m3-purchase-public .m3-actions{display:flex;gap:8px;margin-top:12px}
.m3-purchase-public .m3-actions-right{justify-content:flex-end}
.m3-purchase-public .m3-grid{display:grid;grid-template-columns:1fr;gap:12px 16px}
@media (min-width: 720px){
  .m3-purchase-public .m3-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
.m3-purchase-public .m3-file{display:inline-block;appearance:none;background:#49ca69;color:#fff;border:1px solid #49ca69;padding:9px 12px;border-radius:6px;cursor:pointer}
.m3-purchase-public .m3-file:hover{background:#00a32a;border-color:#00a32a}
.m3-offer-public .m3-file{display:inline-block;appearance:none;background:#49ca69;color:#fff;border:1px solid #49ca69;padding:6px 10px;border-radius:6px;cursor:pointer;line-height:1.2;font-size:13px;height:auto}
.m3-offer-public .m3-file:hover{background:#00a32a;border-color:#00a32a}
.m3-purchase-public .button.button-primary{background:#49ca69;border-color:#49ca69}
.m3-purchase-public .button.button-primary:hover{background:#00a32a;border-color:#00a32a}
.m3-purchase-public .m3-file::-webkit-file-upload-button{visibility:hidden}
.m3-purchase-public .m3-file::file-selector-button{display:none}
.m3-purchase-public .m3-previews{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.m3-purchase-public .m3-previews .m3-thumb{position:relative;width:110px;height:110px;border:1px solid #e5e7eb;border-radius:6px;overflow:hidden}
.m3-purchase-public .m3-previews .m3-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.m3-purchase-public .m3-previews .m3-remove{position:absolute;top:4px;right:4px;background:rgba(0,0,0,.6);color:#fff;border:none;border-radius:4px;padding:2px 6px;cursor:pointer;font-size:10px}
.m3-purchase-public .m3-side-card, .m3-offer-public .m3-side-card{background:transparent;border:0px solid #e5e7eb;border-radius:8px 0 8px 0;padding:2px;margin-bottom:8px}
.m3-purchase-public .m3-side-logo img, .m3-offer-public .m3-side-logo img{max-width:160px;height:auto;display:block;margin:10px 0 8px auto}
.m3-purchase-public .m3-side-logo, .m3-offer-public .m3-side-logo{ text-align:right }
.m3-purchase-public .m3-side-company, .m3-offer-public .m3-side-company{font-size:14px;text-align:right}
.m3-purchase-public .m3-side-dept, .m3-offer-public .m3-side-dept{font-size:14px;color:#374151;margin-bottom:6px;text-align:right}
.m3-purchase-public .m3-side-address, .m3-offer-public .m3-side-address{white-space:pre-line;font-size:15px;color:#374151;line-height:1.15;margin:0 0 10px 0;text-align:right}
.m3-purchase-public .m3-side-phone a,
.m3-purchase-public .m3-side-email a,
.m3-purchase-public .m3-side-whatsapp a,
.m3-offer-public .m3-side-phone a,
.m3-offer-public .m3-side-email a,
.m3-offer-public .m3-side-whatsapp a{ text-decoration:none; color:inherit }
.m3-purchase-public .m3-side-row, .m3-offer-public .m3-side-row{ display:flex; align-items:center; justify-content:flex-end; gap:8px; font-size:15px; margin-bottom:8px }
.m3-purchase-public .m3-icon, .m3-offer-public .m3-icon{ color:#00a32a; display:inline-flex; align-items:center }
.m3-purchase-public .m3-icon svg, .m3-offer-public .m3-icon svg{ width:1em; height:1em; display:block }
.m3-purchase-public .m3-side-divider, .m3-offer-public .m3-side-divider{ border-bottom:none; padding-bottom:0; }
.m3-purchase-public .m3-side-reviews, .m3-offer-public .m3-side-reviews{ margin-top:12px }
.m3-purchase-public .m3-side-maps iframe, .m3-offer-public .m3-side-maps iframe{ width:100% !important; height:auto; border:0 }
.m3-purchase-public .m3-side-hours, .m3-offer-public .m3-side-hours {
  margin-top: 10px;
}

.m3-purchase-public .m3-side-hours ul {
  margin: 6px 0 0;
  padding: 0;
  list-style: none;
  font-size: 14px;
  color: #333;
}

.m3-purchase-public .m3-side-hours ul li {
  display: flex;
  justify-content: space-between;
  padding: 3px 0;
  border-bottom: 1px solid #eee; /* optional für Trennlinien */
}

.m3-purchase-public .m3-side-hours ul li span.day {
  font-weight: 600;
  flex: 1; /* sorgt dafür, dass alle Tage gleich breit sind */
}

.m3-purchase-public .m3-side-hours ul li span.time {
  flex: 1;
  text-align: right;
}