/* Sayyarati V87.66 — tow owner management polish + modern tow image picker. */

/* Management sheet: larger, cleaner cards with a useful tow-truck photo. */
.tow-my-v8764__dialog{width:min(680px,100%)}
.tow-my-v8764__list{gap:10px}
.tow-my-v8764__card{
  grid-template-columns:118px minmax(0,1fr) 44px;
  gap:13px;
  min-height:118px;
  padding:11px;
  border-color:#d8e5f4;
  border-radius:20px;
  background:linear-gradient(145deg,#fff 0%,#fbfdff 100%);
  box-shadow:0 8px 24px rgba(25,67,122,.07);
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}
.tow-my-v8764__card:hover{transform:translateY(-1px);border-color:#afcdf6;box-shadow:0 13px 30px rgba(24,78,150,.12)}
.tow-my-v8764__media{
  width:118px;
  height:92px;
  aspect-ratio:auto;
  border:1px solid #cfe0f3;
  border-radius:17px;
  background:linear-gradient(145deg,#eef5ff,#f8fbff);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.7);
}
.tow-my-v8764__media img{width:100%;height:100%;object-fit:cover}
.tow-my-v8764__media.is-placeholder img{object-fit:contain;padding:9px}
.tow-my-v8764__info{gap:7px}
.tow-my-v8764__name-row>strong{font-size:17px;line-height:1.35}
.tow-my-v8764__name-row>em{min-height:24px;padding:0 9px;font-size:9px}
.tow-my-v8764__location{font-size:10px;gap:6px}
.tow-my-v8764__metrics{gap:6px}
.tow-my-v8764__metrics b{
  min-height:27px;
  padding:0 8px;
  border:1px solid #dfebf9;
  border-radius:999px;
  background:#f5f9ff;
  color:#5e7591;
  font-size:9px;
}
.tow-my-v8764__open i{width:36px;height:36px;border-radius:12px;background:#e9f3ff;font-size:13px;box-shadow:inset 0 0 0 1px #d6e7fb}
.tow-my-v8764__open small{font-size:8px}

/* Modern image picker. The native file button is intentionally hidden; the
   whole visual card opens the chooser instead. */
.tow-image-picker-v8766{display:grid;gap:8px;min-width:0;direction:rtl}
.tow-image-picker-v8766 [hidden]{display:none!important}
.tow-image-picker-v8766__label{display:flex;align-items:center;gap:7px;color:#314b70;font-size:12px;font-weight:950}
.tow-image-picker-v8766__label>b,.tow-image-picker-v8766__label>small{display:inline-flex;align-items:center;min-height:22px;padding:0 8px;border-radius:999px;font-size:9px;font-weight:950}
.tow-image-picker-v8766__label>b{background:#fff0f0;color:#cf3535}
.tow-image-picker-v8766__label>small{background:#eef4fb;color:#6c8099}
.tow-image-picker-v8766__surface{
  position:relative;
  display:grid;
  grid-template-columns:128px minmax(0,1fr);
  gap:15px;
  align-items:center;
  min-height:112px;
  padding:10px;
  overflow:hidden;
  border:1.5px solid #cfe0f5;
  border-radius:20px;
  background:linear-gradient(135deg,#f8fbff 0%,#edf5ff 100%);
  box-shadow:0 8px 22px rgba(26,84,157,.07),inset 0 0 0 1px rgba(255,255,255,.8);
  cursor:pointer;
  transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease;
}
.tow-image-picker-v8766__surface:hover{border-color:#8db9f6;box-shadow:0 11px 26px rgba(25,93,180,.11),inset 0 0 0 1px rgba(255,255,255,.85)}
.tow-image-picker-v8766__surface:focus-within{border-color:#2475e8;box-shadow:0 0 0 3px rgba(36,117,232,.12),0 11px 26px rgba(25,93,180,.1)}
.tow-image-picker-v8766__surface:active{transform:scale(.997)}
.tow-image-picker-v8766__surface>input[type=file]{position:absolute!important;inset:0!important;z-index:4!important;width:100%!important;height:100%!important;margin:0!important;padding:0!important;border:0!important;opacity:0!important;cursor:pointer!important}
.tow-image-picker-v8766__preview{
  position:relative;
  z-index:1;
  display:grid;
  place-items:center;
  width:128px;
  height:92px;
  overflow:hidden;
  border:1px solid #cedff3;
  border-radius:17px;
  background:#fff;
  color:#2169d7;
  box-shadow:0 5px 14px rgba(20,76,143,.08);
}
.tow-image-picker-v8766__preview img{width:100%;height:100%;display:block;object-fit:cover}
.tow-image-picker-v8766__placeholder{display:grid;place-items:center;width:100%;height:100%;background:linear-gradient(145deg,#f5f9ff,#eaf3ff)}
.tow-image-picker-v8766__placeholder i{font-size:34px;color:#276ed3}
.tow-image-picker-v8766__copy{position:relative;z-index:1;display:grid;justify-items:start;gap:5px;min-width:0}
.tow-image-picker-v8766__copy>strong{color:#17375f;font-size:15px;font-weight:1000;line-height:1.45}
.tow-image-picker-v8766__copy>small{max-width:100%;overflow:hidden;color:#71839a;font-size:10px;font-weight:800;line-height:1.55;text-overflow:ellipsis;white-space:nowrap}
.tow-image-picker-v8766__choose{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;margin-top:3px;padding:0 13px;border-radius:11px;background:linear-gradient(135deg,#1670f1,#0d5bd7);color:#fff;box-shadow:0 7px 16px rgba(13,91,215,.2)}
.tow-image-picker-v8766__choose i{font-size:12px}.tow-image-picker-v8766__choose b{font-size:10px;font-weight:1000}
.tow-image-picker-v8766__foot{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0}
.tow-image-picker-v8766__foot>small{color:#7f8da0;font-size:9.5px;font-weight:750;line-height:1.6}
.tow-image-picker-v8766__foot>button{flex:0 0 auto;display:inline-flex;align-items:center;gap:5px;min-height:30px;padding:0 9px;border:1px solid #d9e5f3;border-radius:9px;background:#fff;color:#54708f;font:inherit;font-size:9px;font-weight:900;cursor:pointer}
.tow-image-picker-v8766__foot>button:hover{background:#f5f9ff;border-color:#bfd5ef;color:#245f9e}

/* The picker sits outside rental98-base-grid, so give it comfortable spacing. */
.rental-service-manager-v8598-body .tow-image-picker-v8766{margin-bottom:14px}

@media(max-width:700px){
  .tow-my-v8764__dialog{width:100%}
  .tow-my-v8764__card{grid-template-columns:104px minmax(0,1fr) 36px;gap:10px;min-height:108px;padding:9px;border-radius:17px}
  .tow-my-v8764__media{width:104px;height:84px;border-radius:15px}
  .tow-my-v8764__name-row>strong{font-size:15px}
  .tow-my-v8764__metrics b{min-height:25px;padding:0 7px;font-size:8.5px}
  .tow-my-v8764__open i{width:31px;height:31px;border-radius:10px}

  .tow-image-picker-v8766__surface{grid-template-columns:104px minmax(0,1fr);gap:11px;min-height:102px;padding:9px;border-radius:17px}
  .tow-image-picker-v8766__preview{width:104px;height:82px;border-radius:14px}
  .tow-image-picker-v8766__placeholder i{font-size:29px}
  .tow-image-picker-v8766__copy>strong{font-size:13px}
  .tow-image-picker-v8766__copy>small{font-size:9px}
  .tow-image-picker-v8766__choose{min-height:34px;padding:0 10px;border-radius:10px}
  .tow-image-picker-v8766__choose b{font-size:9px}
  .tow-image-picker-v8766__foot{align-items:flex-start}
}

@media(max-width:430px){
  .tow-my-v8764__card{grid-template-columns:96px minmax(0,1fr) 34px;gap:8px}
  .tow-my-v8764__media{width:96px;height:80px}
  .tow-image-picker-v8766__surface{grid-template-columns:96px minmax(0,1fr)}
  .tow-image-picker-v8766__preview{width:96px;height:78px}
}