/*
 * A158 - Garajim responsive gorunum duzenlemesi
 *
 * A104'te masaustu gorunumu yaklasik %30 kuculten kurallar kaldirildi.
 * Bu dosya yalnizca garage.php icinde yuklenir ve Garajim uye panelini
 * okunabilir masaustu, tablet ve mobil olculerinde tutar.
 */

/* Genel: Garajim sayfasi kendi alaninda akiskan ve okunabilir kalsin. */
.garage-member-page-full{
  width:min(1480px,calc(100% - 32px));
  max-width:1480px;
  margin:24px auto 10px;
  padding:0;
  min-width:0;
}
.garage-member-page-full .garage-member-content-full,
.garage-member-page-full .garage-member-shell,
.garage-member-page-full .garage-dashboard-card,
.garage-member-page-full .garage-dashboard-card-title,
.garage-member-page-full .garage-dashboard-body,
.garage-member-page-full .garage-dashboard-specs-grid,
.garage-member-page-full .garage-dashboard-maintenance{
  min-width:0;
}
.garage-member-page-full .garage-member-shell{
  width:100%;
  border-radius:24px;
}

/* Ust baslik: kucultme yerine okunabilir olcek. */
.garage-member-page-full .garage-member-head,
.garage-member-page-full .garage-dashboard-head{
  gap:22px;
  padding:26px 30px;
}
.garage-member-page-full .garage-member-kicker{
  gap:8px;
  padding:8px 13px;
  font-size:12px;
}
.garage-member-page-full .garage-member-head h1{
  margin:7px 0 6px !important;
  font-size:34px !important;
  line-height:1.12 !important;
}
.garage-member-page-full .garage-member-head p{
  max-width:720px;
  font-size:14px;
  line-height:1.65;
}
.garage-member-page-full .garage-add-trigger{
  min-height:46px;
  padding:0 20px;
  font-size:14px;
}

/* Arac karti basligi ve aksiyonlar. */
.garage-member-page-full .garage-dashboard-list{
  gap:24px;
  padding:26px;
}
.garage-member-page-full .garage-dashboard-card{
  border-radius:28px;
}
.garage-member-page-full .garage-dashboard-card-top{
  gap:20px;
  padding:24px 28px 18px;
}
.garage-member-page-full .garage-dashboard-breadcrumb{
  gap:8px;
  margin-bottom:10px;
  font-size:12px;
}
.garage-member-page-full .garage-dashboard-name-row{
  gap:11px;
}
.garage-member-page-full .garage-dashboard-name-row h2{
  font-size:clamp(25px,2.05vw,31px);
  overflow-wrap:anywhere;
}
.garage-member-page-full .garage-dashboard-card-title p{
  margin-top:7px;
  font-size:13px;
}
.garage-member-page-full .garage-dashboard-active{
  gap:7px;
  padding:7px 12px;
  font-size:11px;
}
.garage-member-page-full .garage-dashboard-top-actions{
  gap:9px;
  max-width:760px;
}
.garage-member-page-full .garage-pill-btn{
  min-height:42px;
  height:42px;
  padding:0 15px;
  gap:8px;
  font-size:13px;
  line-height:1.15;
}
.garage-member-page-full .garage-dashboard-icon-actions{
  gap:7px;
}
.garage-member-page-full .garage-icon-btn{
  width:42px;
  height:42px;
  min-width:42px;
  font-size:14px;
}

/* Ana bilgi govdesi. */
.garage-member-page-full .garage-dashboard-body{
  grid-template-columns:minmax(240px,300px) minmax(380px,1fr) minmax(220px,270px);
  gap:22px;
  padding:22px 28px 24px;
}
.garage-member-page-full .garage-dashboard-vehicle-column{
  gap:14px;
}
.garage-member-page-full .garage-dashboard-vehicle-visual{
  min-height:180px;
  border-radius:22px;
  padding:16px;
}
.garage-member-page-full .garage-dashboard-vehicle-visual img{
  max-height:160px;
}
.garage-member-page-full .garage-plate-box{
  min-height:50px;
  gap:11px;
  padding-right:15px;
}
.garage-member-page-full .garage-plate-flag{
  min-width:40px;
  font-size:12px;
}
.garage-member-page-full .garage-plate-box strong{
  font-size:15px;
}
.garage-member-page-full .garage-vehicle-note{
  gap:8px;
  font-size:12px;
  line-height:1.55;
}

/* Arac bilgi kartlari. */
.garage-member-page-full .garage-dashboard-specs-grid{
  gap:14px;
}
.garage-member-page-full .garage-spec-card{
  grid-template-columns:52px minmax(0,1fr);
  gap:12px;
  min-height:84px;
  border-radius:20px;
  padding:14px 16px;
}
.garage-member-page-full .garage-spec-card .icon{
  width:46px;
  height:46px;
  font-size:18px;
}
.garage-member-page-full .garage-spec-card small{
  margin-bottom:4px;
  font-size:11px;
}
.garage-member-page-full .garage-spec-card strong{
  font-size:17px;
  overflow-wrap:anywhere;
}

/* Bakim slayti. */
.garage-member-page-full .garage-dashboard-maintenance{
  gap:12px;
}
.garage-member-page-full .garage-ring{
  width:176px;
  height:176px;
  padding:13px;
}
.garage-member-page-full .garage-ring-center strong{
  font-size:36px;
}
.garage-member-page-full .garage-ring-center span{
  font-size:12px;
}
.garage-member-page-full .garage-maintenance-copy h3{
  font-size:20px;
}
.garage-member-page-full .garage-maintenance-copy p{
  max-width:240px;
  font-size:14px;
}
.garage-member-page-full .garage-mini-status-card{
  grid-template-columns:42px minmax(0,1fr);
  gap:11px;
  padding:13px 14px;
}
.garage-member-page-full .garage-mini-status-card .icon{
  width:42px;
  height:42px;
}
.garage-member-page-full .garage-mini-status-card strong{
  font-size:13px;
}
.garage-member-page-full .garage-mini-status-card span{
  font-size:11px;
}
.garage-member-page-full .garage-maintenance-slider-controls>button{
  width:40px;
  height:40px;
  min-width:40px;
  font-size:14px;
}
.garage-member-page-full .garage-maintenance-dots button{
  width:9px;
  height:9px;
}
.garage-member-page-full .garage-maintenance-dots button.active{
  width:28px;
}

/* Alt bilgi seridi. */
.garage-member-page-full .garage-dashboard-footer{
  gap:14px;
  padding:15px 28px 22px;
}
.garage-member-page-full .garage-dashboard-footer-left,
.garage-member-page-full .garage-dashboard-footer-center,
.garage-member-page-full .garage-dashboard-footer-link{
  gap:7px;
  font-size:12px;
  line-height:1.45;
}

/* Orta masaustu / kucuk laptop: aksiyonlari rahat kir, bakimi alta al. */
@media (max-width:1320px){
  .garage-member-page-full .garage-dashboard-card-top{
    flex-direction:column;
    align-items:stretch;
  }
  .garage-member-page-full .garage-dashboard-top-actions{
    width:100%;
    max-width:none;
    justify-content:flex-start;
  }
  .garage-member-page-full .garage-dashboard-body{
    grid-template-columns:minmax(230px,280px) minmax(0,1fr);
  }
  .garage-member-page-full .garage-dashboard-maintenance{
    grid-column:1/-1;
    width:100%;
    max-width:620px;
    margin:4px auto 0;
  }
}

/* Tablet: menu butonlari buyuk ve dokunulabilir, bilgi kartlari iki sutun. */
@media (max-width:1024px){
  .garage-member-page-full{
    width:calc(100% - 24px);
    margin-top:18px;
  }
  .garage-member-page-full .garage-member-head,
  .garage-member-page-full .garage-dashboard-head{
    align-items:flex-start;
    flex-direction:column;
    padding:22px;
  }
  .garage-member-page-full .garage-member-head h1{
    font-size:30px !important;
  }
  .garage-member-page-full .garage-add-trigger{
    width:100%;
  }
  .garage-member-page-full .garage-dashboard-list{
    padding:20px;
  }
  .garage-member-page-full .garage-dashboard-card-top{
    padding:21px 22px 17px;
  }
  .garage-member-page-full .garage-dashboard-top-actions{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
  }
  .garage-member-page-full .garage-pill-btn{
    width:100%;
    min-height:46px;
    height:auto;
    padding:10px 12px;
    white-space:normal;
    text-align:center;
    font-size:13px;
  }
  .garage-member-page-full .garage-dashboard-icon-actions{
    grid-column:1/-1;
    width:100%;
    justify-content:flex-start;
    padding-top:2px;
  }
  .garage-member-page-full .garage-icon-btn{
    width:44px;
    height:44px;
    min-width:44px;
    font-size:15px;
  }
  .garage-member-page-full .garage-dashboard-body{
    grid-template-columns:1fr;
    gap:20px;
    padding:20px 22px 22px;
  }
  .garage-member-page-full .garage-dashboard-vehicle-column{
    width:100%;
    justify-items:center;
  }
  .garage-member-page-full .garage-dashboard-vehicle-visual{
    width:min(100%,460px);
    min-height:190px;
  }
  .garage-member-page-full .garage-vehicle-note{
    justify-content:center;
    text-align:center;
  }
  .garage-member-page-full .garage-dashboard-specs-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    width:100%;
  }
  .garage-member-page-full .garage-dashboard-maintenance{
    grid-column:auto;
    width:min(100%,520px);
    justify-items:center;
  }
  .garage-member-page-full .garage-dashboard-footer{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    align-items:center;
    padding:15px 22px 20px;
  }
  .garage-member-page-full .garage-dashboard-footer-link{
    grid-column:1/-1;
  }
}

/* Telefon: tum bolumler gercek tek sutun responsive duzene gecer. */
@media (max-width:700px){
  .garage-member-page-full{
    width:calc(100% - 16px);
    margin:12px auto 8px;
  }
  .garage-member-page-full .garage-member-shell{
    border-radius:18px;
  }
  .garage-member-page-full .garage-member-head,
  .garage-member-page-full .garage-dashboard-head{
    padding:18px;
    gap:16px;
  }
  .garage-member-page-full .garage-member-kicker{
    font-size:11px;
  }
  .garage-member-page-full .garage-member-head h1{
    font-size:27px !important;
  }
  .garage-member-page-full .garage-member-head p{
    font-size:13px;
  }
  .garage-member-page-full .garage-dashboard-list{
    gap:18px;
    padding:12px;
  }
  .garage-member-page-full .garage-dashboard-card{
    border-radius:20px;
  }
  .garage-member-page-full .garage-dashboard-card-top{
    padding:19px 16px 16px;
  }
  .garage-member-page-full .garage-dashboard-breadcrumb{
    font-size:11px;
    flex-wrap:wrap;
  }
  .garage-member-page-full .garage-dashboard-name-row{
    align-items:flex-start;
  }
  .garage-member-page-full .garage-dashboard-name-row h2{
    width:100%;
    font-size:25px;
    line-height:1.18;
  }
  .garage-member-page-full .garage-dashboard-card-title p{
    font-size:12px;
  }
  .garage-member-page-full .garage-dashboard-top-actions{
    grid-template-columns:1fr;
    gap:9px;
  }
  .garage-member-page-full .garage-pill-btn{
    min-height:48px;
    justify-content:flex-start;
    padding:0 16px;
    text-align:left;
    font-size:14px;
    white-space:nowrap;
  }
  .garage-member-page-full .garage-dashboard-icon-actions{
    display:grid;
    grid-template-columns:repeat(5,44px);
    gap:9px;
    justify-content:start;
    overflow-x:auto;
    padding:2px 0 4px;
  }
  .garage-member-page-full .garage-dashboard-icon-actions form{
    width:44px;
  }
  .garage-member-page-full .garage-dashboard-body{
    gap:18px;
    padding:18px 16px 20px;
  }
  .garage-member-page-full .garage-dashboard-vehicle-visual{
    min-height:165px;
    border-radius:18px;
  }
  .garage-member-page-full .garage-dashboard-vehicle-visual img{
    max-height:145px;
  }
  .garage-member-page-full .garage-plate-box{
    min-height:48px;
  }
  .garage-member-page-full .garage-dashboard-specs-grid{
    grid-template-columns:1fr;
    gap:10px;
  }
  .garage-member-page-full .garage-spec-card{
    grid-template-columns:48px minmax(0,1fr);
    min-height:76px;
    border-radius:17px;
    padding:12px 14px;
  }
  .garage-member-page-full .garage-spec-card .icon{
    width:42px;
    height:42px;
    font-size:16px;
  }
  .garage-member-page-full .garage-spec-card small{
    font-size:11px;
  }
  .garage-member-page-full .garage-spec-card strong{
    font-size:16px;
  }
  .garage-member-page-full .garage-dashboard-maintenance{
    width:100%;
  }
  .garage-member-page-full .garage-maintenance-slides{
    min-height:380px;
  }
  .garage-member-page-full .garage-ring{
    width:164px;
    height:164px;
  }
  .garage-member-page-full .garage-maintenance-copy h3{
    font-size:19px;
  }
  .garage-member-page-full .garage-maintenance-copy p{
    font-size:13px;
  }
  .garage-member-page-full .garage-mini-status-card{
    max-width:100%;
  }
  .garage-member-page-full .garage-maintenance-slider-controls{
    gap:10px;
  }
  .garage-member-page-full .garage-maintenance-slider-controls>button{
    width:44px;
    height:44px;
    min-width:44px;
  }
  .garage-member-page-full .garage-dashboard-footer{
    grid-template-columns:1fr;
    gap:11px;
    padding:14px 16px 18px;
  }
  .garage-member-page-full .garage-dashboard-footer-link{
    grid-column:auto;
    min-height:42px;
    justify-content:space-between;
    border-top:1px solid #edf3f9;
    padding-top:10px;
  }
}

@media (max-width:380px){
  .garage-member-page-full .garage-dashboard-list{
    padding:8px;
  }
  .garage-member-page-full .garage-dashboard-card-top,
  .garage-member-page-full .garage-dashboard-body,
  .garage-member-page-full .garage-dashboard-footer{
    padding-left:13px;
    padding-right:13px;
  }
  .garage-member-page-full .garage-pill-btn{
    font-size:13px;
  }
  .garage-member-page-full .garage-dashboard-icon-actions{
    grid-template-columns:repeat(5,42px);
    gap:7px;
  }
  .garage-member-page-full .garage-icon-btn,
  .garage-member-page-full .garage-dashboard-icon-actions form{
    width:42px;
    height:42px;
    min-width:42px;
  }
}