/*
|--------------------------------------------------------------------------
| Stage 123 - Ys Comindo Technician Image Asset + Hero Visual Final
|--------------------------------------------------------------------------
| Memasang asset visual teknisi berlogo Ys Comindo di website dan dashboard.
*/
:root{--ys123-blue:#0D6EFD;--ys123-navy:#0B1F3A;--ys123-cyan:#00B8D9;--ys123-soft:#EAF4FF;--ys123-line:#D8E6F7;--ys123-green:#22C55E;--ys123-shadow:0 22px 58px rgba(11,31,58,.13)}
.ys123-tech-visual{position:relative;overflow:hidden;border-radius:28px;background:linear-gradient(135deg,#F8FBFF,#EAF4FF);border:1px solid var(--ys123-line);box-shadow:var(--ys123-shadow)}
.ys123-tech-visual img{display:block;width:100%;height:auto;object-fit:contain}.ys123-tech-visual.compact{border-radius:22px}.ys123-tech-visual.compact img{max-height:260px}.ys123-tech-caption{position:absolute;left:18px;bottom:18px;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);border:1px solid rgba(216,230,247,.9);border-radius:18px;padding:12px 14px;box-shadow:0 14px 32px rgba(11,31,58,.12);max-width:255px}.ys123-tech-caption strong{display:block;color:var(--ys123-navy);font-size:14px}.ys123-tech-caption small{display:block;color:#64748B;margin-top:3px;line-height:1.35}.ys123-visual-badge{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid #B9D7FF;color:var(--ys123-blue);border-radius:999px;padding:7px 10px;font-weight:900;font-size:12px;box-shadow:0 10px 24px rgba(13,110,253,.10)}
body.ys-public-unified .ys118-hero-public{grid-template-columns:1fr minmax(320px,.9fr);align-items:center}.ys123-public-hero-visual{min-height:360px;display:flex;align-items:center;justify-content:center}.ys123-public-hero-visual img{max-height:420px}.ys123-public-hero-visual:before{content:"";position:absolute;inset:auto -80px -90px auto;width:260px;height:260px;border-radius:999px;background:rgba(13,110,253,.10)}.ys123-public-hero-visual:after{content:"YS COMINDO SERVICE";position:absolute;right:18px;top:18px;letter-spacing:.16em;font-size:11px;font-weight:900;color:rgba(11,31,58,.35)}
.ys123-dashboard-hero{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:18px;align-items:stretch;margin-bottom:18px}.ys123-dashboard-hero .ys118-head{margin:0!important}.ys123-dashboard-hero .ys123-tech-visual{min-height:210px}.ys123-dashboard-hero .ys123-tech-visual img{height:100%;min-height:210px;object-fit:cover;object-position:center}.ys123-dashboard-mini{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:center;padding:14px;border-radius:20px;border:1px solid var(--ys123-line);background:#fff;box-shadow:0 10px 28px rgba(11,31,58,.07)}.ys123-dashboard-mini img{width:88px;height:88px;border-radius:18px;object-fit:cover;background:#EAF4FF}.ys123-dashboard-mini strong{display:block;color:var(--ys123-navy)}.ys123-dashboard-mini small{display:block;color:#64748B;line-height:1.35;margin-top:3px}.ys123-proof-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.ys123-proof-tile{min-height:112px;border-radius:18px;border:1px dashed #9CC9FF;background:linear-gradient(135deg,#F8FBFF,#EAF4FF);display:flex;align-items:center;justify-content:center;text-align:center;color:var(--ys123-blue);font-weight:900}.ys123-proof-tile span{display:block;font-size:26px;margin-bottom:4px}.ys123-stage-page{display:grid;gap:20px}.ys123-stage-hero{background:linear-gradient(135deg,var(--ys123-navy),var(--ys123-blue));color:#fff;border-radius:28px;padding:26px;box-shadow:var(--ys123-shadow);display:grid;grid-template-columns:minmax(0,1.2fr) minmax(260px,.8fr);gap:22px;align-items:center}.ys123-stage-hero p{color:#DBEAFE;margin:6px 0 0}.ys123-stage-hero .ys123-tech-visual{background:#fff}.ys123-stage-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.ys123-stage-card{background:#fff;border:1px solid var(--ys123-line);border-radius:22px;padding:18px;box-shadow:0 12px 30px rgba(11,31,58,.07)}.ys123-stage-card strong{display:block;color:var(--ys123-navy);font-size:24px}.ys123-stage-card span{display:block;color:#64748B;margin-top:4px}.ys123-stage-panel{background:#fff;border:1px solid var(--ys123-line);border-radius:24px;padding:20px;box-shadow:0 12px 30px rgba(11,31,58,.07)}.ys123-check-list{display:grid;gap:10px}.ys123-check-row{display:flex;justify-content:space-between;gap:12px;align-items:center;border:1px solid #E7F1FF;background:#FAFDFF;border-radius:16px;padding:12px}.ys123-status{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:5px 10px;font-size:12px;font-weight:900}.ys123-status.ok{background:#DCFCE7;color:#166534}.ys123-status.warn{background:#FEF3C7;color:#B45309}.ys123-status.bad{background:#FEE2E2;color:#991B1B}
@media(max-width:1100px){body.ys-public-unified .ys118-hero-public,.ys123-dashboard-hero,.ys123-stage-hero{grid-template-columns:1fr}.ys123-stage-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.ys123-public-hero-visual{min-height:300px}.ys123-public-hero-visual img{max-height:350px}}
@media(max-width:768px){.ys123-tech-caption{position:relative;left:auto;bottom:auto;margin:12px}.ys123-public-hero-visual{min-height:auto}.ys123-dashboard-hero{display:block}.ys123-dashboard-hero .ys123-tech-visual{margin-top:14px}.ys123-stage-grid{grid-template-columns:1fr}.ys123-stage-hero{padding:20px}.ys123-proof-grid{grid-template-columns:1fr 1fr}.ys123-dashboard-mini{grid-template-columns:72px 1fr}.ys123-dashboard-mini img{width:72px;height:72px}}

/* Stage 131 - Dashboard caption cleanup */
.ys123-dashboard-mini.image-only{
  display:flex;
  align-items:center;
  justify-content:center;
  padding:12px;
  min-height:150px;
}
.ys123-dashboard-mini.image-only img{
  width:100%;
  max-width:220px;
  height:140px;
  border-radius:20px;
  object-fit:contain;
}
.ys123-tech-visual.compact:not(:has(.ys123-tech-caption)){
  display:flex;
  align-items:center;
  justify-content:center;
}
.ys123-tech-visual.compact:not(:has(.ys123-tech-caption)) img{
  object-fit:contain;
  background:linear-gradient(135deg,#F8FBFF,#EAF4FF);
}
@media(max-width:768px){
  .ys123-dashboard-mini.image-only img{max-width:180px;height:120px}
}