/* Shared mobile containment: keep cards and form controls inside their owning panel. */
@media (max-width:800px){
  html,body{width:100%;max-width:100%;overflow-x:clip}
  main{width:100%;max-width:100%;min-width:0}
  main :where(div,section,article,form,fieldset,label){min-width:0}
  main>*,main .card,main section,main article,main form,main fieldset{max-width:100%}
  main :where(input,select,textarea){min-width:0;max-width:100%;box-sizing:border-box}
  main input[type=radio],main input[type=checkbox]{flex:0 0 20px;width:20px!important;min-width:20px!important;max-width:20px!important;height:20px;margin:0;padding:0}
  main .switch-control input{position:absolute;flex:0 0 1px;width:1px!important;min-width:1px!important;max-width:1px!important;height:1px}
  main .color-choice input{position:absolute;flex:0 0 1px;width:1px!important;min-width:1px!important;max-width:1px!important;height:1px}
  main :where(img,svg,canvas,video){max-width:100%}
  main :where(.grid,.filters,.form,.title){min-width:0;max-width:100%}
  .title{flex-wrap:wrap}
  .title>*{min-width:0;max-width:100%}
  .title h1,.title h2,.title p,.card h1,.card h2,.card h3{overflow-wrap:anywhere}
  button,.button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
  .table-wrap,.hotel-admin-table-wrap,.hotel-admin-wide-wrap,.user-table,.flight-pdf-preview,.gantt-shell{max-width:100%;overscroll-behavior-x:contain}
  dialog{width:calc(100% - 12px)!important;max-width:calc(100% - 12px)!important;margin-left:auto!important;margin-right:auto!important}
  dialog>*{min-width:0;max-width:100%}
  .dialog-head>div,.board-edit-head>div,.hotel-dialog-head>div{min-width:0}
  .package-company-selector{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:10px!important}
  .package-company-selector>strong{grid-column:1/-1}
  .package-company-selector label{min-width:0;max-width:100%;gap:7px!important;overflow-wrap:anywhere}
  .gantt-mode-select,.guide-choice-item>label,.board-guide-languages label,.same-day-arrival-check,.hotel-breakfast-field>span,.board-check-label{min-width:0;max-width:100%}
}

@media (max-width:480px){
  main{padding-left:10px;padding-right:10px}
  .card{padding:16px 14px}
  .title h1{font-size:clamp(24px,8vw,32px)}
  .dialog-head,.board-edit-head{gap:10px}
  .dialog-head p,.board-edit-head p{overflow-wrap:anywhere}
  .dialog-actions,.board-edit-actions,.hotel-form-actions{max-width:100%}
  .package-company-selector{grid-template-columns:minmax(0,1fr)}
}