/*
 * OFTALMO Registry — Mobile Final V4
 * Mobile-first, dense clinical layout. Desktop styles remain unchanged.
 */

html{
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
}

html,body{
  max-width:100%;
  overflow-x:hidden;
}

img,svg,video,canvas{
  max-width:100%;
  height:auto;
}

.table-wrap,.matrix-wrap,.responsive-table,.table-responsive{
  max-width:100%;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}

@media (max-width:767px){
  :root{
    --mobile-gap:6px;
    --mobile-radius:10px;
    --mobile-control:36px;
  }

  html{ font-size:13px !important; }
  body{
    margin:0 !important;
    font-size:13px !important;
    line-height:1.28 !important;
    background:#f2f7f8 !important;
  }

  *,*::before,*::after{ box-sizing:border-box; }

  /* Main containers */
  .shell,.shell.narrow,.pro-shell,.v42-shell,.dashboard-shell,.clinic-shell{
    width:100% !important;
    max-width:100% !important;
    margin:0 auto !important;
    padding:5px 6px calc(12px + env(safe-area-inset-bottom)) !important;
  }

  .patient-main-grid,.pro-grid,.v42-layout,.stats-grid,.module-grid,.case-grid{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:6px !important;
  }

  .patient-main-grid > *, .pro-grid > *, .v42-layout > *{
    min-width:0 !important;
    grid-column:1 / -1 !important;
  }

  /* Compact top area */
  .topbar{
    min-height:0 !important;
    padding:6px 8px !important;
    gap:6px !important;
    flex-wrap:wrap !important;
  }
  .brand-logo{
    width:34px !important;
    height:34px !important;
    border-radius:9px !important;
  }
  .brand strong{ font-size:12px !important; line-height:1.15 !important; }
  .brand span{ font-size:9px !important; line-height:1.15 !important; }
  .top-actions{ gap:4px !important; }
  .top-actions .btn{
    min-height:30px !important;
    padding:5px 8px !important;
    font-size:10.5px !important;
    border-radius:7px !important;
  }
  .user-name{ display:none !important; }

  .hero,.patient-head,.pro-hero,.v42-hero{
    margin:5px 0 6px !important;
    padding:9px 10px !important;
    border-radius:11px !important;
  }
  .hero h1,.patient-head h1,.pro-hero h1,.v42-hero h1{
    margin:0 0 3px !important;
    font-size:18px !important;
    line-height:1.1 !important;
  }
  .hero p,.patient-head p,.pro-hero p,.v42-hero p{
    margin:2px 0 !important;
    font-size:10.5px !important;
    line-height:1.25 !important;
  }
  .dossier-progress{ margin-top:5px !important; gap:6px !important; }
  .progress-track{ height:5px !important; }
  .v4-status{ font-size:9.5px !important; }

  /* Horizontal clinical navigation */
  .pro-nav,.v42-steps,.clinic-tabs,.tabs-nav{
    position:sticky !important;
    top:0 !important;
    z-index:50 !important;
    display:flex !important;
    flex-wrap:nowrap !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    white-space:nowrap !important;
    gap:3px !important;
    margin:0 0 6px !important;
    padding:3px !important;
    border-radius:8px !important;
    background:rgba(255,255,255,.97) !important;
    box-shadow:0 3px 12px rgba(23,58,94,.08) !important;
    scrollbar-width:none;
    -webkit-overflow-scrolling:touch;
  }
  .pro-nav::-webkit-scrollbar,.v42-steps::-webkit-scrollbar,
  .clinic-tabs::-webkit-scrollbar,.tabs-nav::-webkit-scrollbar{ display:none; }
  .pro-nav a,.v42-step,.clinic-tabs a,.tabs-nav a{
    flex:0 0 auto !important;
    min-height:27px !important;
    padding:4px 7px !important;
    font-size:9.5px !important;
    line-height:1 !important;
    border-radius:6px !important;
    white-space:nowrap !important;
  }

  /* Medical cards */
  .card,.panel,.pro-card,.v4-card,.v42-card,.v42-module,.case-card,.stat-card{
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    margin:0 !important;
    padding:9px !important;
    border-radius:10px !important;
    box-shadow:0 2px 9px rgba(23,58,94,.045) !important;
    content-visibility:auto;
    contain-intrinsic-size:250px;
  }

  .v4-heading,.pro-section-title{
    margin:0 0 5px !important;
    gap:4px !important;
  }
  .v4-kicker,.pro-kicker{
    margin:0 0 1px !important;
    font-size:9px !important;
    line-height:1 !important;
    font-weight:900 !important;
    letter-spacing:.75px !important;
  }
  .v4-heading h2,.pro-section-title h2{
    margin:0 !important;
    font-size:15px !important;
    line-height:1.08 !important;
  }
  .v4-heading p,.pro-section-title p{
    display:none !important;
  }

  /* Two-column clinical grid on phones */
  .v4-fields,.v4-fields.two,.pro-fields,.v42-fields,.form-grid,
  #pacient .v4-fields,#date .v4-fields,#examen .v4-fields.two,
  #investigatii .v4-fields,#operatie .v4-fields,#externare .v4-fields{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
    align-items:start !important;
  }

  /* Undo the old mobile rule that forced every field to span the full row. */
  .v4-fields > *,.pro-fields > *,.v42-fields > *,.form-grid > *{
    grid-column:auto !important;
    min-width:0 !important;
  }

  /* Long text and explicit wide fields stay full width */
  .v4-field.full,.v4-field.wide,.pro-field.full,.pro-field.wide,.v42-field.full,.v42-field.wide,
  .span-2,.span-3,.span-4,.span-6,.span-8,.span-12,
  #diagnostic .v4-fields,#tratament .v4-fields,#documente .v4-fields,
  .pro-fields > [style*="grid-column:1/-1"],
  .pro-fields > [style*="grid-column: 1 / -1"]{
    grid-column:1 / -1 !important;
  }
  #diagnostic .v4-fields,#tratament .v4-fields,#documente .v4-fields{
    grid-template-columns:minmax(0,1fr) !important;
  }

  /* Pair patient fields: Nume|Prenume, Sex|Data nașterii, IDNP|Telefon */
  #pacient .v4-fields > :nth-child(1){ order:1; }
  #pacient .v4-fields > :nth-child(2){ order:2; }
  #pacient .v4-fields > :nth-child(5){ order:3; }
  #pacient .v4-fields > :nth-child(4){ order:4; }
  #pacient .v4-fields > :nth-child(3){ order:5; }
  #pacient .v4-fields > :nth-child(6){ order:6; }
  #pacient .v4-fields > :nth-child(7){ order:7; }
  #pacient .v4-fields > :nth-child(8){ order:8; }

  .v4-field,.pro-field,.v42-field{
    min-width:0 !important;
    gap:1px !important;
  }
  .v4-field > span,.pro-field > span,.v42-field > span,label{
    margin:0 !important;
    font-size:10px !important;
    line-height:1.08 !important;
    font-weight:800 !important;
  }

  input:not([type="checkbox"]):not([type="radio"]),select,.form-control,.form-select{
    width:100% !important;
    min-width:0 !important;
    min-height:var(--mobile-control) !important;
    height:var(--mobile-control) !important;
    padding:5px 7px !important;
    border-radius:7px !important;
    font-size:14px !important;
    line-height:1.1 !important;
  }
  input[type="date"]{
    min-width:0 !important;
    padding-inline:4px !important;
    text-align:center !important;
  }

  textarea,.v4-field textarea,.pro-field textarea,.v42-field textarea{
    width:100% !important;
    min-width:0 !important;
    min-height:44px !important;
    height:44px;
    max-height:112px !important;
    padding:6px 7px !important;
    border-radius:7px !important;
    font-size:13px !important;
    line-height:1.18 !important;
    resize:vertical !important;
  }
  #investigatii textarea{
    min-height:42px !important;
    height:42px;
    max-height:86px !important;
  }
  #tratament textarea,#externare textarea{
    min-height:50px !important;
    height:50px;
  }
  textarea::placeholder,input::placeholder{
    font-size:10.5px !important;
    line-height:1.12 !important;
    opacity:.48 !important;
  }

  /* Compact eye summary: OD and OS side-by-side */
  #examen .v4-fields.two,.eye-summary-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
  #examen .v4-note,.eye-summary{
    min-width:0 !important;
    padding:7px !important;
    font-size:10.5px !important;
    line-height:1.22 !important;
  }
  .eye-summary-title{
    display:block;
    margin-bottom:5px;
    font-size:10.5px;
    line-height:1.1;
  }
  .eye-values{
    display:grid;
    grid-template-columns:1fr;
    gap:2px;
  }
  .eye-values span{ white-space:normal; }

  /* Compact actions and badges */
  .btn,button,input[type="submit"],input[type="button"]{
    min-height:34px !important;
    padding:5px 9px !important;
    border-radius:7px !important;
    font-size:11px !important;
    line-height:1.08 !important;
  }
  .section-action{
    display:flex !important;
    width:100% !important;
    margin-top:6px !important;
    justify-content:center !important;
  }
  .v4-inline,.patient-strip{
    gap:4px !important;
    margin-top:5px !important;
  }
  .v4-badge,.mini-badge,.v42-chip,.patient-strip span{
    padding:3px 6px !important;
    font-size:9px !important;
    line-height:1.05 !important;
  }
  .v4-note{
    padding:7px !important;
    font-size:10.5px !important;
    line-height:1.25 !important;
  }
  .v4-doc-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:6px !important;
  }
  .v4-doc{
    padding:8px !important;
    border-radius:7px !important;
    font-size:10.5px !important;
  }

  /* Tables and matrix */
  table{ font-size:10px !important; }
  table th,table td{ padding:5px 6px !important; white-space:nowrap; }
  .exam-head{ display:none !important; }
  .exam-row,.exam-row.simple{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:5px !important;
    padding:6px !important;
  }
  .exam-row .exam-label{
    grid-column:1 / -1 !important;
    margin:0 !important;
    font-size:10px !important;
    font-weight:850 !important;
  }

  /* Autosave feedback appears briefly and no longer blocks content */
  .save-pill,.autosave{
    position:fixed !important;
    right:6px !important;
    bottom:max(6px,env(safe-area-inset-bottom)) !important;
    z-index:100 !important;
    min-height:0 !important;
    padding:4px 6px !important;
    border-radius:999px !important;
    font-size:8.5px !important;
    line-height:1 !important;
    opacity:0 !important;
    transform:translateY(5px) !important;
    pointer-events:none !important;
    transition:opacity .16s ease,transform .16s ease !important;
  }
  .save-pill.is-visible,.autosave.is-visible{
    opacity:.92 !important;
    transform:translateY(0) !important;
  }
  .save-pill[hidden],.autosave[hidden]{ display:none !important; }

  /* Login */
  .auth-body{ min-height:100dvh !important; padding:10px !important; }
  .auth-card{ width:100% !important; max-width:420px !important; padding:17px 14px !important; border-radius:15px !important; }
  .auth-card h1{ font-size:21px !important; }
}

@media (max-width:339px){
  .v4-fields,.v4-fields.two,.pro-fields,.v42-fields,.form-grid,
  #pacient .v4-fields,#date .v4-fields,#examen .v4-fields.two,
  #investigatii .v4-fields,#operatie .v4-fields,#externare .v4-fields{
    grid-template-columns:minmax(0,1fr) !important;
  }
  .v4-field.full,.v4-field.wide,.pro-field.full,.pro-field.wide,.v42-field.full,.v42-field.wide{
    grid-column:1 / -1 !important;
  }
}

/* ================================================================
   OFTALMO Responsive V5
   Final cascade layer for phone, tablet and desktop usability.
   ================================================================ */

:where(.topbar,.shell,.pro-shell,.clinic-shell,.dashboard-shell,.docs,
       .hero,.patient-head,.pro-hero,.clinic-head,
       .card,.panel,.pro-card,.v4-card,.v42-card,.diag-card,.doc,
       .patient-main-grid,.pro-grid,.v42-layout,.stats-grid,.module-grid,
       .case-grid,.case-card-grid,.form-grid,.pro-fields,.v4-fields,
       .v42-fields,.diag-grid,.doc-grid,.exam-row) > *{
  min-width:0;
}

:where(h1,h2,h3,p,span,strong,a,label,th,td){
  overflow-wrap:anywhere;
}

:where(button,.btn,a.btn,input,select,textarea){
  touch-action:manipulation;
}

:where(input,select,textarea,button){
  max-width:100%;
}

:where(.table-wrap,.matrix-wrap,.responsive-table,.table-responsive){
  overscroll-behavior-inline:contain;
  scrollbar-gutter:stable;
}

/* Tablet: retain useful columns while keeping every panel inside the viewport. */
@media (min-width:768px) and (max-width:1024px){
  .shell,.shell.narrow,.pro-shell,.v42-shell,.dashboard-shell,.clinic-shell,.docs{
    width:100% !important;
    max-width:100% !important;
    padding-inline:20px !important;
  }

  .topbar{
    padding:12px 20px !important;
    gap:14px !important;
  }

  .stats-grid,.module-grid,.case-card-grid,.doc-grid{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .patient-main-grid,.pro-grid,.v42-layout{
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  .pro-card.full,.v4-card.full,.v42-card.full{
    grid-column:1 / -1 !important;
  }

  .top-actions,.pro-actions,.form-actions{
    flex-wrap:wrap !important;
  }

  .btn,button,input[type="submit"],input[type="button"]{
    min-height:44px !important;
    font-size:14px !important;
  }

  input:not([type="checkbox"]):not([type="radio"]),select:not([multiple]),textarea{
    min-height:44px !important;
    height:auto !important;
    font-size:16px !important;
  }
}

/* Phones: readable controls, one-column data entry and reliable touch targets. */
@media (max-width:767px){
  :root{
    --mobile-gap:10px;
    --mobile-radius:12px;
    --mobile-control:48px;
  }

  html{
    font-size:16px !important;
  }

  body{
    font-size:15px !important;
    line-height:1.45 !important;
  }

  .shell,.shell.narrow,.pro-shell,.v42-shell,.dashboard-shell,.clinic-shell,.docs{
    width:100% !important;
    max-width:100% !important;
    padding:12px max(12px,env(safe-area-inset-right))
      calc(18px + env(safe-area-inset-bottom))
      max(12px,env(safe-area-inset-left)) !important;
  }

  .topbar{
    width:100% !important;
    padding:10px max(12px,env(safe-area-inset-right))
      10px max(12px,env(safe-area-inset-left)) !important;
    gap:10px !important;
  }

  .brand{
    min-width:0 !important;
    gap:10px !important;
  }

  .brand-logo,.brand-logo.small,.clinic-logo-shell,.ivedere-brand-logo{
    width:44px !important;
    height:44px !important;
    min-width:44px !important;
    border-radius:12px !important;
  }

  .brand strong{
    font-size:14px !important;
    line-height:1.25 !important;
  }

  .brand span{
    font-size:11px !important;
    line-height:1.3 !important;
  }

  .top-actions{
    width:100% !important;
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:8px !important;
  }

  .top-actions .btn{
    width:100% !important;
  }

  .hero,.patient-head,.pro-hero,.v42-hero,.clinic-head{
    width:100% !important;
    margin:0 0 12px !important;
    padding:16px !important;
    gap:12px !important;
    border-radius:16px !important;
  }

  .hero h1,.patient-head h1,.pro-hero h1,.v42-hero h1,.clinic-head h1{
    margin:0 0 5px !important;
    font-size:23px !important;
    line-height:1.16 !important;
  }

  .hero p,.patient-head p,.pro-hero p,.v42-hero p,.clinic-head p{
    font-size:14px !important;
    line-height:1.4 !important;
  }

  .patient-main-grid,.pro-grid,.v42-layout,.stats-grid,.stat-grid,
  .module-grid,.case-grid,.case-card-grid,.form-grid,.pro-fields,
  .v4-fields,.v4-fields.two,.v42-fields,.diag-grid,.doc-grid,
  .recent-grid,.patient-grid,.eye-summary-grid,
  #pacient .v4-fields,#date .v4-fields,#examen .v4-fields.two,
  #investigatii .v4-fields,#operatie .v4-fields,#externare .v4-fields{
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
  }

  .patient-main-grid > *,.pro-grid > *,.v42-layout > *,.stats-grid > *,
  .module-grid > *,.case-grid > *,.case-card-grid > *,.form-grid > *,
  .pro-fields > *,.v4-fields > *,.v42-fields > *,.diag-grid > *,
  .doc-grid > *{
    min-width:0 !important;
    grid-column:1 / -1 !important;
  }

  .card,.panel,.pro-card,.v4-card,.v42-card,.v42-module,
  .case-card,.stat-card,.diag-card,.doc{
    width:100% !important;
    max-width:100% !important;
    padding:14px !important;
    border-radius:14px !important;
  }

  .v4-heading,.pro-section-title,.diag-title,.card-head{
    margin-bottom:10px !important;
    gap:8px !important;
  }

  .v4-kicker,.pro-kicker{
    font-size:11px !important;
    line-height:1.2 !important;
  }

  .v4-heading h2,.pro-section-title h2,.diag-title h2,.card-head h2{
    font-size:18px !important;
    line-height:1.2 !important;
  }

  .v4-heading p,.pro-section-title p{
    display:block !important;
    font-size:13px !important;
    line-height:1.4 !important;
  }

  .pro-nav,.v42-steps,.clinic-tabs,.tabs-nav{
    gap:6px !important;
    padding:6px !important;
    margin-bottom:12px !important;
    border-radius:12px !important;
  }

  .pro-nav a,.v42-step,.clinic-tabs a,.tabs-nav a{
    min-height:44px !important;
    padding:10px 12px !important;
    font-size:13px !important;
    line-height:1.15 !important;
  }

  .v4-field,.pro-field,.v42-field,label{
    gap:5px !important;
    font-size:13px !important;
    line-height:1.3 !important;
  }

  .v4-field > span,.pro-field > span,.v42-field > span,label{
    font-size:13px !important;
    line-height:1.3 !important;
  }

  input:not([type="checkbox"]):not([type="radio"]),
  select:not([multiple]),.form-control,.form-select{
    width:100% !important;
    min-width:0 !important;
    min-height:48px !important;
    height:auto !important;
    padding:11px 12px !important;
    border-radius:10px !important;
    font-size:16px !important;
    line-height:1.25 !important;
  }

  textarea,.v4-field textarea,.pro-field textarea,.v42-field textarea,
  #investigatii textarea,#tratament textarea,#externare textarea{
    width:100% !important;
    min-width:0 !important;
    min-height:96px !important;
    height:auto !important;
    max-height:none !important;
    padding:11px 12px !important;
    border-radius:10px !important;
    font-size:16px !important;
    line-height:1.4 !important;
  }

  textarea::placeholder,input::placeholder{
    font-size:14px !important;
    line-height:1.3 !important;
    opacity:.65 !important;
  }

  .btn,button,input[type="submit"],input[type="button"]{
    min-height:44px !important;
    padding:10px 13px !important;
    border-radius:10px !important;
    font-size:14px !important;
    line-height:1.2 !important;
  }

  .pro-actions,.form-actions,.search-row{
    width:100% !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
  }

  .pro-actions .btn,.form-actions .btn,.search-row .btn{
    width:100% !important;
    justify-content:center !important;
  }

  .v4-badge,.mini-badge,.v42-chip,.patient-strip span{
    padding:5px 8px !important;
    font-size:12px !important;
    line-height:1.2 !important;
  }

  .v4-note,#examen .v4-note,.eye-summary{
    padding:10px !important;
    font-size:13px !important;
    line-height:1.4 !important;
  }

  .v4-doc-grid{
    grid-template-columns:minmax(0,1fr) !important;
    gap:10px !important;
  }

  .v4-doc{
    padding:12px !important;
    font-size:14px !important;
  }

  table{
    width:max-content !important;
    min-width:100% !important;
    font-size:13px !important;
  }

  table th,table td{
    padding:10px !important;
    white-space:nowrap;
  }

  .table-wrap,.matrix-wrap,.responsive-table,.table-responsive{
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    border-radius:12px !important;
  }

  .exam-head{
    display:none !important;
  }

  .exam-row,.exam-row.simple{
    grid-template-columns:minmax(0,1fr) !important;
    gap:8px !important;
    padding:10px !important;
  }

  .exam-row .exam-label{
    grid-column:1 / -1 !important;
    font-size:13px !important;
  }

  .auth-body{
    min-height:100dvh !important;
    padding:14px !important;
    align-items:center !important;
  }

  .auth-card{
    width:100% !important;
    max-width:460px !important;
    padding:22px 18px !important;
    border-radius:18px !important;
  }

  .auth-card h1{
    font-size:26px !important;
    line-height:1.15 !important;
  }

  .local-badge{
    margin-top:14px !important;
    font-size:12px !important;
  }
}

@media (max-width:479px){
  .top-actions{
    grid-template-columns:minmax(0,1fr) !important;
  }

  .patient-meta,.patient-strip,.v4-inline{
    gap:6px !important;
  }
}

/* Compact landscape phones: preserve vertical workspace without tiny controls. */
@media (max-width:900px) and (max-height:520px) and (orientation:landscape){
  .auth-body{
    align-items:flex-start !important;
  }

  .auth-card{
    margin-block:8px !important;
  }
}

/* V8: section-aware phone layout, tuned from real-device screenshots. */
@media (max-width:767px){
  body{
    line-height:1.35 !important;
  }

  .app-shell,.page-shell,.container,.wrap,.patient-shell,.pro-shell,.v42-shell{
    padding-left:8px !important;
    padding-right:8px !important;
  }

  .patient-main-grid,.pro-grid,.v42-layout{
    gap:9px !important;
  }

  .card,.panel,.pro-card,.v4-card,.v42-card,.v42-module,
  .case-card,.stat-card,.diag-card,.doc{
    padding:12px !important;
    border-radius:13px !important;
  }

  .v4-heading,.pro-section-title,.diag-title,.card-head{
    margin-bottom:8px !important;
    gap:4px !important;
  }

  .v4-kicker,.pro-kicker{
    font-size:10px !important;
    letter-spacing:.09em !important;
  }

  .v4-heading h2,.pro-section-title h2,.diag-title h2,.card-head h2{
    font-size:20px !important;
    line-height:1.12 !important;
  }

  .v4-heading p,.pro-section-title p{
    display:-webkit-box !important;
    margin-top:3px !important;
    overflow:hidden !important;
    -webkit-box-orient:vertical !important;
    -webkit-line-clamp:2 !important;
    font-size:12px !important;
    line-height:1.35 !important;
  }

  .pro-nav,.v42-steps,.clinic-tabs,.tabs-nav{
    position:relative !important;
    display:flex !important;
    width:100% !important;
    max-width:100% !important;
    gap:4px !important;
    padding:4px 24px 4px 4px !important;
    margin-bottom:9px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x proximity !important;
    scrollbar-width:none !important;
    -webkit-overflow-scrolling:touch !important;
    -webkit-mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 24px),transparent 100%) !important;
    mask-image:linear-gradient(90deg,#000 0,#000 calc(100% - 24px),transparent 100%) !important;
  }

  .pro-nav::-webkit-scrollbar,.v42-steps::-webkit-scrollbar,
  .clinic-tabs::-webkit-scrollbar,.tabs-nav::-webkit-scrollbar{
    display:none !important;
  }

  .pro-nav a,.v42-step,.clinic-tabs a,.tabs-nav a{
    flex:0 0 auto !important;
    min-width:82px !important;
    min-height:40px !important;
    padding:8px 10px !important;
    scroll-snap-align:start !important;
    justify-content:center !important;
    text-align:center !important;
    white-space:nowrap !important;
    font-size:12px !important;
  }

  .v4-fields,.v4-fields.two,.pro-fields,.v42-fields,.form-grid,
  #pacient .v4-fields,#date .v4-fields,#examen .v4-fields.two,
  #investigatii .v4-fields,#operatie .v4-fields,#externare .v4-fields{
    gap:8px !important;
  }

  .v4-field,.pro-field,.v42-field,label{
    gap:4px !important;
  }

  .v4-field > span,.pro-field > span,.v42-field > span,label{
    font-size:12px !important;
    line-height:1.25 !important;
  }

  input:not([type="checkbox"]):not([type="radio"]),
  select:not([multiple]),.form-control,.form-select{
    min-height:44px !important;
    padding:9px 10px !important;
    border-radius:9px !important;
    font-size:16px !important;
  }

  textarea,.v4-field textarea,.pro-field textarea,.v42-field textarea{
    min-height:78px !important;
    padding:9px 10px !important;
    border-radius:9px !important;
    font-size:16px !important;
  }

  #investigatii textarea{
    min-height:68px !important;
  }

  .btn,button,input[type="submit"],input[type="button"]{
    min-height:44px !important;
    padding:9px 11px !important;
    border-radius:9px !important;
    font-size:13px !important;
  }

  .v4-note,#examen .v4-note,.eye-summary{
    padding:8px !important;
    font-size:12px !important;
    line-height:1.35 !important;
  }

  #examen .eye-summary-grid{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:7px !important;
  }

  #examen .eye-summary-grid > *{
    grid-column:auto !important;
    min-width:0 !important;
  }

  #pacient .v4-fields,
  #date .v4-fields,
  #investigatii .v4-fields,
  #externare .v4-fields{
    display:grid !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }

  #pacient .v4-fields > *,
  #date .v4-fields > *,
  #investigatii .v4-fields > *,
  #externare .v4-fields > *{
    grid-column:auto !important;
    min-width:0 !important;
  }

  #pacient .v4-fields > .full,#pacient .v4-fields > .wide,
  #date .v4-fields > .full,#date .v4-fields > .wide,
  #investigatii .v4-fields > .full,#investigatii .v4-fields > .wide,
  #externare .v4-fields > .full,#externare .v4-fields > .wide{
    grid-column:1 / -1 !important;
  }

  #operatie .v4-fields{
    display:grid !important;
    grid-template-columns:minmax(0,1.55fr) minmax(104px,.85fr) !important;
  }

  #operatie .v4-fields > *{
    grid-column:auto !important;
    min-width:0 !important;
  }

  #operatie .v4-fields > :nth-child(1),
  #operatie .v4-fields > :nth-child(3){
    grid-column:1 !important;
  }

  #operatie .v4-fields > :nth-child(2),
  #operatie .v4-fields > :nth-child(4){
    grid-column:2 !important;
  }

  #operatie .v4-fields > :nth-child(11),
  #operatie .v4-fields > :nth-child(12),
  #operatie .v4-fields > :nth-child(13),
  #operatie .v4-fields > .full{
    grid-column:1 / -1 !important;
  }

  #operatie select{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  .pro-actions,.form-actions,.search-row{
    gap:7px !important;
  }
}

@media (max-width:359px){
  #pacient .v4-fields,
  #date .v4-fields,
  #investigatii .v4-fields,
  #operatie .v4-fields,
  #externare .v4-fields,
  #examen .eye-summary-grid{
    grid-template-columns:minmax(0,1fr) !important;
  }

  #pacient .v4-fields > *,#date .v4-fields > *,
  #investigatii .v4-fields > *,#operatie .v4-fields > *,
  #externare .v4-fields > *,#examen .eye-summary-grid > *{
    grid-column:1 !important;
  }
}