/* 3S Forms - Accommodation Inspection Design Unifier */
:root{
  --red:#d90000!important;
  --border:#222!important;
  --text:#111!important;
  --bg:#f1f1f1!important;
  --outer-bg:#dcdcdc!important;
  --font-main:Arial,Tahoma,"Segoe UI",sans-serif!important;
}
*{box-sizing:border-box;-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;}
html,body{margin:0!important;padding:0!important;background:var(--outer-bg)!important;color:var(--text)!important;font-family:var(--font-main)!important;font-size:11px!important;line-height:1.0!important;}
.toolbar{position:sticky!important;top:0!important;z-index:1000!important;display:flex!important;gap:10px!important;justify-content:center!important;align-items:center!important;flex-wrap:wrap!important;padding:12px!important;background:#fff!important;border-bottom:1px solid #ccc!important;}
.toolbar button,.toolbar a{background:var(--red)!important;color:#fff!important;border:none!important;border-radius:8px!important;padding:8px 14px!important;font-size:12px!important;cursor:pointer!important;font-weight:700!important;text-decoration:none!important;}
.toolbar .dark,.toolbar .secondary{background:#333!important;color:#fff!important;}
.toolbar .light{background:#f1f1f1!important;color:#111!important;border:1px solid #ccc!important;}
.toolbar span,.hint{font-size:11px!important;color:#333!important;}
.page,.page-sheet,.form-sheet{width:210mm!important;min-height:297mm!important;height:297mm!important;margin:12px auto!important;background:var(--bg)!important;position:relative!important;padding:12mm 9mm 22mm!important;box-shadow:0 0 10px rgba(0,0,0,.15)!important;overflow:hidden!important;isolation:auto!important;page-break-after:always!important;}
.page:last-of-type{page-break-after:auto!important;}
.page::before,.page-sheet::before,.form-sheet::before{display:none!important;content:none!important;}
.page>*{position:relative;z-index:1;}
.print-area{height:100%!important;display:block!important;}
.brand-header,.official-header{width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;margin:0 auto 4px!important;display:block!important;text-align:center!important;}
.brand-header img,.official-header img,.header-logo{width:100%!important;max-width:100%!important;height:auto!important;max-height:31mm!important;object-fit:contain!important;display:block!important;margin:0 auto 4px!important;}
.code,.form-code{font-size:8.5px!important;line-height:1!important;margin:0 0 2px!important;padding:0 0 2px!important;border-bottom:1px solid #555!important;color:#111!important;font-weight:400!important;}
.topline,.top-line,.bottom-line{border-top:1px solid #555!important;margin:4px 0 5px!important;}
.title-en,.main-title{width:62%!important;margin:4px auto 2px!important;background:var(--red)!important;color:#fff!important;text-align:center!important;font-weight:700!important;font-size:12px!important;padding:5px 10px!important;border-radius:6px!important;border:none!important;line-height:1.1!important;letter-spacing:0!important;}
.title-ar{color:#111!important;background:transparent!important;text-align:center!important;font-size:12px!important;font-weight:700!important;margin:0 0 8px!important;direction:rtl!important;line-height:1.1!important;}
.main-title .ar{font-size:12px!important;font-weight:700!important;direction:rtl!important;margin:0!important;}
table{width:100%!important;border-collapse:collapse!important;table-layout:fixed!important;}
th,td{border:1px solid var(--border)!important;padding:1px 3px!important;vertical-align:middle!important;font-family:var(--font-main)!important;}
.red,.sec-title,.section-title,.main-title,.table-title,.red-title,.acc-title,.pm-title,.pm-sub,.red-label,.section-head td,.vehicle-info th.red,.accessories th.red,.remarks th.red,.ack th.red,.sig-table th.red,.pm th.red{background:var(--red)!important;background-color:var(--red)!important;color:#fff!important;font-weight:700!important;text-align:center!important;}
input,textarea,select,button{font-family:var(--font-main)!important;}
input[type="text"],input[type="datetime-local"],input[type="number"],input:not([type]),textarea{background:transparent!important;outline:none!important;}
input[type="checkbox"]{accent-color:var(--red)!important;width:11px!important;height:11px!important;}
.right,.ar,.rtl{direction:rtl!important;text-align:right!important;}
.center{text-align:center!important;}.bold,.label{font-weight:700!important;}
.vehicle-form .page{padding:6mm 8mm 22mm!important;}
.vehicle-form body,.vehicle-form{font-size:8.5px!important;line-height:1.02!important;}
.vehicle-form .title-en{font-size:12px!important;}
.vehicle-form .title-ar{font-size:12px!important;margin-bottom:3px!important;}
.vehicle-form .vehicle-info th{height:18px!important;font-size:8.2px!important;}
.vehicle-form .vehicle-info td{height:14px!important;}
.vehicle-form .remarks td{height:112px!important;}
.vehicle-form .body-box{height:110px!important;background:#efefef!important;}
.vehicle-form .vehicle-diagram-wrap{height:98px!important;}
.vehicle-form .ack td{height:18px!important;}
.vehicle-form .signatures{margin-top:3px!important;}
.undertaking-form .page{padding:9mm 9mm 22mm!important;}
.undertaking-form .official-header img{max-height:31mm!important;}
.undertaking-form .details-table,.undertaking-form .asset-table,.undertaking-form .sign-table{width:100%!important;margin-left:0!important;margin-right:0!important;}
.undertaking-form .details-table td,.undertaking-form .details-table th,.undertaking-form .asset-table td,.undertaking-form .asset-table th,.undertaking-form .sign-table td{height:21px!important;padding:2px 4px!important;}
.undertaking-form .details-table .label,.undertaking-form .asset-table th,.undertaking-form .asset-table .wide-label,.undertaking-form .sign-table .red-label{font-size:11px!important;}
.undertaking-form .undertaking-lines{width:100%!important;margin:4px 0 5px!important;}
.undertaking-form .undertaking-lines .line{gap:12px!important;margin-bottom:4px!important;}
.undertaking-form .undertaking-lines .en,.undertaking-form .undertaking-lines .ar{font-size:10.8px!important;line-height:1.12!important;}
.undertaking-form .notice-row{width:100%!important;margin:8px 0 0!important;gap:14mm!important;font-size:10.8px!important;color:var(--red)!important;}
.master-form .page{padding:12mm 9mm 22mm!important;}
.brand-footer,.official-footer,.footer-date{display:none!important;}
.unified-inspection-footer{position:absolute!important;left:10mm!important;right:10mm!important;bottom:4mm!important;border-top:1px solid #555!important;padding-top:6px!important;display:grid!important;grid-template-columns:1.25fr .8fr 1.1fr!important;gap:14px!important;align-items:start!important;font-size:8.4px!important;line-height:1.05!important;color:#111!important;background:transparent!important;z-index:2!important;}
.unified-inspection-footer .col{min-height:46px!important;border:0!important;padding:0!important;}
.unified-inspection-footer .center-col{text-align:center!important;border-left:1px solid #555!important;border-right:1px solid #555!important;padding:0 10px!important;display:flex!important;flex-direction:column!important;justify-content:center!important;min-height:68px!important;}
.unified-inspection-footer .right{direction:rtl!important;text-align:right!important;}
.unified-inspection-footer strong{color:var(--red)!important;font-size:11px!important;}
@media print{
  html,body{width:210mm!important;height:297mm!important;background:#fff!important;}
  .toolbar,.modal-backdrop,.signature-modal-backdrop,.email-modal-backdrop,.no-print,.no-export,.signature-remove{display:none!important;}
  .page,.page-sheet,.form-sheet{width:210mm!important;height:297mm!important;min-height:297mm!important;margin:0!important;box-shadow:none!important;background:var(--bg)!important;}
  @page{size:A4 portrait;margin:0;}
}


/* 2026-04-28 final header/title alignment: match accommodation_inspection.php */
.brand-header,
.official-header{
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  display:block!important;
  text-align:center!important;
  margin:0 auto 3mm!important;
  padding:0!important;
}
.brand-header img,
.official-header img,
.header-logo{
  width:100%!important;
  max-width:100%!important;
  min-width:100%!important;
  height:auto!important;
  max-height:none!important;
  object-fit:contain!important;
  display:block!important;
  margin:0 auto 2mm!important;
}
.undertaking-form .official-header img,
.vehicle-form .brand-header img,
.master-form .brand-header img{
  width:100%!important;
  max-width:100%!important;
  max-height:none!important;
  margin:0 auto 2mm!important;
}
.code,
.form-code{
  display:block!important;
  width:100%!important;
  text-align:left!important;
  direction:ltr!important;
  font-size:8.5px!important;
  line-height:1!important;
  margin:0 0 2px!important;
  padding:0 0 2px!important;
  border-bottom:1px solid #555!important;
}
.topline{display:none!important;}
.title-en,
.main-title,
.title-bar{
  display:block!important;
  width:62%!important;
  margin:4px auto 2px!important;
  padding:5px 10px!important;
  background:var(--red)!important;
  color:#fff!important;
  border:0!important;
  border-radius:6px!important;
  text-align:center!important;
  font-size:12px!important;
  line-height:1.1!important;
  font-weight:700!important;
  letter-spacing:0!important;
}
.main-title .ar,
.title-en .ar,
.title-bar .ar{
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.1!important;
  direction:rtl!important;
}
.title-ar{
  width:100%!important;
  text-align:center!important;
  margin:0 0 6px!important;
  color:#111!important;
  background:transparent!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.1!important;
  direction:rtl!important;
}
.undertaking-form .main-title,
.vehicle-form .title-en,
.master-form .title-en{
  width:62%!important;
  margin-left:auto!important;
  margin-right:auto!important;
  text-align:center!important;
}
@media print{
  .brand-header img,
  .official-header img,
  .header-logo{
    width:100%!important;
    max-width:100%!important;
    max-height:none!important;
    height:auto!important;
  }
  .title-en,
  .main-title,
  .title-bar{
    width:62%!important;
    margin-left:auto!important;
    margin-right:auto!important;
    text-align:center!important;
    background:var(--red)!important;
    color:#fff!important;
  }
}
