/* =========================================================
   APP BRAGA - IPHONE FORCE FINAL
   Corrige: ocupar ecrã todo + sidebar com texto nítido
   ========================================================= */

@media screen and (max-width: 768px) {

  html,
  body {
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    min-height: 100dvh !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
    background: #020617 !important;
  }

  body,
  body.device-phone {
    display: block !important;
    background: #141414 !important;
  }

  .main,
  main,
  .main-content,
  .page-content,
  .dashboard-container,
  .content-area,
  .dashboard-shell,
  .content {
    margin-left: 0 !important;
    margin-right: 0 !important;
    left: 0 !important;
    right: 0 !important;
    transform: none !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-width: 100vw !important;
    min-height: 100dvh !important;
    box-sizing: border-box !important;
    padding-top: calc(76px + env(safe-area-inset-top, 0px)) !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-x: hidden !important;
  }

  .dashboard-header,
  .page-hero,
  .reference-header,
  .panel,
  .card,
  .dashboard-card,
  .stat-card,
  .metric-card,
  .stock-card,
  .history-card,
  .printer-card,
  .user-card,
  .summary-card,
  .box {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    box-sizing: border-box !important;
  }

  /* Menu hamburger */
  .app-menu-toggle {
    display: grid !important;
    place-items: center !important;
    position: fixed !important;
    top: calc(12px + env(safe-area-inset-top, 0px)) !important;
    left: 12px !important;
    width: 48px !important;
    height: 48px !important;
    z-index: 2147483647 !important;
    border-radius: 16px !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  /* Sidebar fechada */
  body.device-phone aside.sidebar,
  body.device-phone .sidebar,
  aside.sidebar,
  .sidebar,
  #sidebar,
  .enterprise-sidebar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    height: 100dvh !important;
    width: min(340px, 88vw) !important;
    max-width: 340px !important;
    min-width: 286px !important;
    margin: 0 !important;
    padding: calc(78px + env(safe-area-inset-top, 0px)) 14px calc(18px + env(safe-area-inset-bottom, 0px)) 14px !important;
    transform: translateX(-110%) !important;
    transition: transform .22s ease !important;
    z-index: 2147483645 !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    box-sizing: border-box !important;
    filter: none !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  /* Sidebar aberta */
  body.device-phone aside.sidebar.app-open,
  body.device-phone .sidebar.app-open,
  aside.sidebar.app-open,
  .sidebar.app-open,
  #sidebar.app-open,
  .enterprise-sidebar.app-open,
  body.sidebar-open aside.sidebar,
  body.sidebar-open .sidebar {
    transform: translateX(0) !important;
  }

  /* Overlay sem blur em cima da sidebar */
  .app-sidebar-overlay {
    position: fixed !important;
    inset: 0 !important;
    z-index: 2147483640 !important;
    background: rgba(0,0,0,.42) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    filter: none !important;
  }

  .app-sidebar-overlay.show {
    display: block !important;
  }

  /* Texto dos botões da sidebar */
  body.device-phone aside.sidebar a,
  body.device-phone .sidebar a,
  aside.sidebar a,
  .sidebar a,
  #sidebar a,
  .enterprise-sidebar a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 46px !important;
    height: auto !important;
    padding: 12px 13px !important;
    margin: 0 0 8px 0 !important;
    box-sizing: border-box !important;
    font-size: 14px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    text-align: left !important;
    text-indent: 0 !important;
    letter-spacing: normal !important;
    color: #f8fafc !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    opacity: 1 !important;
    visibility: visible !important;
    filter: none !important;
  }

  body.device-phone aside.sidebar a::before,
  body.device-phone .sidebar a::before,
  aside.sidebar a::before,
  .sidebar a::before {
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
    display: inline-grid !important;
    place-items: center !important;
    flex: 0 0 28px !important;
    margin: 0 12px 0 0 !important;
    width: 28px !important;
    min-width: 28px !important;
    height: 28px !important;
    font-size: 17px !important;
    line-height: 1 !important;
    text-align: center !important;
  }

  .sidebar-link-text {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
    max-width: 100% !important;
    filter: none !important;
  }

  body.device-phone .brand,
  body.device-phone .premium-brand,
  .brand,
  .premium-brand {
    width: 100% !important;
    max-width: 100% !important;
  }

  body.device-phone .brand h2,
  body.device-phone .premium-brand h2,
  body.device-phone .brand > div:not(.brand-badge),
  body.device-phone .premium-brand > div:not(.brand-badge),
  .brand h2,
  .premium-brand h2 {
    display: block !important;
    opacity: 1 !important;
    visibility: visible !important;
    color: #fff !important;
    font-size: 20px !important;
    white-space: normal !important;
    filter: none !important;
  }

  body.sidebar-open .main,
  body.sidebar-open main,
  body.sidebar-open .main-content,
  body.sidebar-open .page-content,
  body.sidebar-open .dashboard-container,
  body.sidebar-open .content-area,
  body.sidebar-open .dashboard-shell,
  body.sidebar-open .content {
    filter: blur(4px) !important;
  }

  body.sidebar-open .sidebar,
  body.sidebar-open aside.sidebar,
  body.sidebar-open #sidebar {
    filter: none !important;
  }
}

@media screen and (max-width: 390px) {
  aside.sidebar,
  .sidebar,
  #sidebar,
  .enterprise-sidebar {
    width: 84vw !important;
    min-width: 270px !important;
  }

  aside.sidebar a,
  .sidebar a,
  #sidebar a,
  .enterprise-sidebar a {
    font-size: 13px !important;
  }
}

/* Last mobile override: keep scrolling native on iPhone and small tablets. */
@media screen and (max-width: 768px) {
  html,
  body {
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  .main,
  main,
  .main-content,
  .page-content,
  .dashboard-container,
  .content-area,
  .dashboard-shell,
  .content {
    height: auto !important;
    max-height: none !important;
    min-height: 100svh !important;
    overflow: visible !important;
    touch-action: pan-y !important;
    overscroll-behavior-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body:not(.sidebar-open) .app-sidebar-overlay {
    display: none !important;
    pointer-events: none !important;
    touch-action: none !important;
  }
}

/* Final iPhone sidebar repair: override older compact-icon rules. */
@media screen and (max-width: 768px) {
  body.sidebar-open aside.sidebar,
  body.sidebar-open .sidebar,
  aside.sidebar.app-open,
  .sidebar.app-open {
    width: min(340px, 88vw) !important;
    min-width: min(286px, 88vw) !important;
    max-width: 88vw !important;
    transform: translateX(0) !important;
    pointer-events: auto !important;
    z-index: 2147483645 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.sidebar-open aside.sidebar a,
  body.sidebar-open .sidebar a,
  aside.sidebar.app-open a,
  .sidebar.app-open a {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: 100% !important;
    min-height: 48px !important;
    padding: 12px 13px !important;
    pointer-events: auto !important;
    color: #f8fafc !important;
    text-decoration: none !important;
  }

  body.sidebar-open .sidebar-link-text,
  .sidebar.app-open .sidebar-link-text {
    display: inline-block !important;
    opacity: 1 !important;
    visibility: visible !important;
    max-width: calc(100% - 44px) !important;
    overflow: visible !important;
    white-space: normal !important;
    color: inherit !important;
  }

  body.sidebar-open .app-sidebar-overlay.show {
    display: block !important;
    pointer-events: auto !important;
  }
}

/* iPhone hard close/open contract: older sidebar rules must not leave it fixed open. */
@media screen and (max-width: 768px) {
  body.device-phone:not(.sidebar-open) aside.sidebar:not(.app-open),
  body.device-phone:not(.sidebar-open) .sidebar:not(.app-open),
  body.device-phone:not(.sidebar-open) #sidebar:not(.app-open),
  body.device-phone:not(.sidebar-open) .enterprise-sidebar:not(.app-open),
  body.is-ios:not(.sidebar-open) aside.sidebar:not(.app-open),
  body.is-ios:not(.sidebar-open) .sidebar:not(.app-open) {
    transform: translate3d(-112%, 0, 0) !important;
    pointer-events: none !important;
    visibility: hidden !important;
  }

  body.device-phone.sidebar-open aside.sidebar,
  body.device-phone.sidebar-open .sidebar,
  body.device-phone aside.sidebar.app-open,
  body.device-phone .sidebar.app-open,
  body.is-ios.sidebar-open aside.sidebar,
  body.is-ios.sidebar-open .sidebar {
    transform: translate3d(0, 0, 0) !important;
    pointer-events: auto !important;
    visibility: visible !important;
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    height: 100dvh !important;
    max-height: 100dvh !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.device-phone:not(.sidebar-open) .app-sidebar-overlay,
  body.is-ios:not(.sidebar-open) .app-sidebar-overlay {
    display: none !important;
    pointer-events: none !important;
  }

  body.device-phone.sidebar-open,
  body.is-ios.sidebar-open {
    overflow: hidden !important;
  }
}


/* ===== APP BRAGA V1.33.3 - IPHONE 16 PRO MAX SAFE AREA ===== */
html{
  min-height:100%;
  min-height:100dvh;
  background:var(--bg);
}
body{
  min-height:100vh;
  min-height:100dvh;
}
@supports (padding: max(0px)){
  body{
    padding-top: env(safe-area-inset-top, 0px);
    padding-bottom: env(safe-area-inset-bottom, 0px);
    padding-left: env(safe-area-inset-left, 0px);
    padding-right: env(safe-area-inset-right, 0px);
  }
}
@media screen and (max-width: 820px){
  body{
    background:#020617!important;
  }
  .main,
  main,
  .main-content,
  .page-content,
  .dashboard-container,
  .content-area,
  .dashboard-shell,
  .content{
    padding-top: max(104px, calc(72px + env(safe-area-inset-top, 0px)))!important;
    padding-bottom: max(34px, calc(24px + env(safe-area-inset-bottom, 0px)))!important;
  }
  .page-hero,
  .dashboard-header,
  .reference-header{
    margin-top:0!important;
  }
  .app-menu-toggle,
  .mobile-menu-btn,
  .hamburger,
  .sidebar-toggle{
    top: max(16px, calc(12px + env(safe-area-inset-top, 0px)))!important;
  }
  .sidebar,
  aside.sidebar{
    padding-top: max(24px, calc(16px + env(safe-area-inset-top, 0px)))!important;
    padding-bottom: max(18px, calc(14px + env(safe-area-inset-bottom, 0px)))!important;
  }
}
@media screen and (display-mode: fullscreen), screen and (display-mode: standalone){
  @media screen and (max-width: 820px){
    .main,
    main,
    .main-content,
    .page-content,
    .dashboard-container,
    .content-area,
    .dashboard-shell,
    .content{
      padding-top: max(112px, calc(78px + env(safe-area-inset-top, 0px)))!important;
    }
  }
}
/* ===== END APP BRAGA V1.33.3 ===== */

/* ===== APP BRAGA v1.50 - IPHONE POLISH FINAL ===== */
@media screen and (max-width: 768px) {
  :root {
    --iphone-page-pad: 12px;
    --iphone-top-pad: max(82px, calc(62px + env(safe-area-inset-top, 0px)));
    --iphone-bottom-pad: max(22px, calc(18px + env(safe-area-inset-bottom, 0px)));
  }

  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: hidden !important;
    background: #070b12 !important;
  }

  body {
    padding: 0 !important;
  }

  .main,
  main,
  .main-content,
  .page-content,
  .dashboard-container,
  .content-area,
  .dashboard-shell,
  .content {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: var(--iphone-top-pad) var(--iphone-page-pad) var(--iphone-bottom-pad) !important;
    overflow-x: hidden !important;
  }

  .page-hero,
  .dashboard-header,
  .topbar,
  .premium-topbar,
  .reference-header {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: start !important;
    margin: 0 0 12px !important;
    padding: 16px !important;
    border-radius: 18px !important;
  }

  .page-hero-title,
  .dashboard-header h1,
  .topbar h1,
  .main h1 {
    font-size: 24px !important;
    line-height: 1.1 !important;
    letter-spacing: 0 !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
  }

  .section-header,
  .toolbar,
  .card-actions,
  .topbar-status {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    align-items: stretch !important;
  }

  .section-header > *,
  .toolbar > *,
  .card-actions > *,
  .topbar-status > * {
    min-width: 0 !important;
  }

  .panel,
  .dashboard-panel,
  .personal-panel,
  .config-section,
  .stock-card,
  .history-card,
  .pc-card,
  .dashboard-card,
  .card,
  .box,
  .printer-card,
  .network-card,
  .pistol-card,
  .equipment-detail-card,
  .equipment-result-card,
  .equipment-type-card,
  .modal-content,
  .modal-card {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding: 15px !important;
    border-radius: 18px !important;
    box-sizing: border-box !important;
  }

  .stats-grid,
  .form-grid,
  .cards-grid,
  .equipment-grid,
  .radio-cards-grid,
  .enterprise-metrics,
  .personal-grid,
  .zone-grid,
  .diagnostic-grid {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    width: 100% !important;
  }

  input,
  select,
  textarea,
  button,
  .primary-btn,
  .secondary-btn,
  .ghost-btn,
  .action-btn {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 46px !important;
    font-size: 16px !important;
    box-sizing: border-box !important;
  }

  input[type="checkbox"],
  input[type="radio"] {
    width: auto !important;
    min-height: auto !important;
  }

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

  .app-menu-toggle {
    width: 46px !important;
    height: 46px !important;
    top: max(10px, calc(8px + env(safe-area-inset-top, 0px))) !important;
    left: 10px !important;
    border-radius: 15px !important;
  }

  .app-braga-version-fixed {
    top: max(10px, calc(8px + env(safe-area-inset-top, 0px))) !important;
    right: 10px !important;
    max-width: calc(100vw - 72px) !important;
    min-height: 28px !important;
    padding: 5px 8px !important;
    font-size: 10px !important;
  }

  aside.sidebar,
  .sidebar,
  #sidebar,
  .enterprise-sidebar {
    width: min(318px, 86vw) !important;
    min-width: 0 !important;
    max-width: 86vw !important;
    padding: max(66px, calc(54px + env(safe-area-inset-top, 0px))) 12px max(16px, calc(12px + env(safe-area-inset-bottom, 0px))) !important;
    border-radius: 0 22px 22px 0 !important;
    background: linear-gradient(180deg, rgba(10,15,24,.98), rgba(8,12,20,.98)) !important;
  }

  .sidebar .brand,
  .sidebar .premium-brand,
  .sidebar .sidebar-brand-card {
    padding: 10px !important;
    margin-bottom: 10px !important;
    border-radius: 16px !important;
  }

  .sidebar a,
  .sidebar-group-toggle {
    min-height: 44px !important;
    padding: 10px 11px !important;
    margin-bottom: 6px !important;
    border-radius: 13px !important;
  }

  .sidebar a::before,
  .sidebar-group-toggle .sidebar-group-icon {
    width: 26px !important;
    height: 26px !important;
    min-width: 26px !important;
    margin-right: 10px !important;
    border-radius: 9px !important;
  }

  body.sidebar-open .main,
  body.sidebar-open main,
  body.sidebar-open .main-content,
  body.sidebar-open .page-content,
  body.sidebar-open .dashboard-container,
  body.sidebar-open .content-area,
  body.sidebar-open .dashboard-shell,
  body.sidebar-open .content {
    filter: none !important;
  }

  .update-box-appbraga {
    left: 10px !important;
    right: 10px !important;
    bottom: max(10px, calc(8px + env(safe-area-inset-bottom, 0px))) !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 20px !important;
  }
}

/* ===== APP BRAGA v1.51 - IPHONE HARD FIT ===== */
@media (max-width: 767px), (hover: none) and (pointer: coarse) {
  html,
  body {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
    position: relative !important;
  }

  body.app-mobile-actions-on {
    padding-bottom: 0 !important;
  }

  .app-mobile-action-dock {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  body,
  .app,
  .main,
  main,
  .main-content,
  .page-content,
  .content,
  .container,
  .page,
  .page-shell,
  .dashboard,
  .diagnostics-page,
  .config-page,
  .notifications-page,
  .scanner-ia-shell,
  .personal-tools-page {
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow-x: hidden !important;
  }

  .main,
  main,
  .main-content,
  .page-content,
  body.app-design-pro .main,
  body.app-design-pro main,
  body.app-design-pro .main-content {
    margin-left: 0 !important;
    padding-left: max(12px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(12px, env(safe-area-inset-right, 0px)) !important;
    padding-bottom: max(26px, calc(18px + env(safe-area-inset-bottom, 0px))) !important;
  }

  *,
  *::before,
  *::after {
    box-sizing: border-box !important;
    max-width: 100%;
  }

  img,
  video,
  canvas,
  svg,
  iframe {
    max-width: 100% !important;
  }

  .topbar,
  .premium-topbar,
  .page-hero,
  .section-header,
  .panel-header,
  .card-header,
  .filters-bar,
  .toolbar,
  .card-actions,
  .form-actions,
  .actions,
  .scanner-actions,
  .radio-toolbar,
  .etiquetas-bulk-actions {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 10px !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .stats-grid,
  .cards-grid,
  .form-grid,
  .dashboard-grid,
  .dashboard-grid-bottom,
  .dashboard-ops-grid,
  .diagnostic-grid,
  .notification-metrics-pro,
  .notification-control-grid,
  .scanner-options,
  .scanner-health-box,
  .enterprise-grid,
  .systems-grid,
  .quick-grid,
  .kpi-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    min-width: 0 !important;
  }

  .panel,
  .card,
  .premium-card,
  .stat-card,
  .metric-card,
  .stock-card,
  .config-card,
  .config-collapsible-card,
  .diagnostic-card,
  .scanner-panel,
  .notification-panel-pro,
  .notification-devices-pro,
  .modal-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: hidden !important;
  }

  input,
  select,
  textarea,
  button,
  .btn,
  .primary-btn,
  .secondary-btn,
  .scanner-btn {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  button,
  .btn,
  .primary-btn,
  .secondary-btn,
  .scanner-btn,
  .card-actions button,
  .form-actions button,
  .actions button {
    width: 100% !important;
  }

  table,
  .table,
  .data-table,
  .premium-table,
  .notification-devices-pro-table {
    width: 100% !important;
    min-width: 0 !important;
  }

  .table-wrap,
  .table-container,
  .responsive-table,
  .data-table-wrap,
  .notification-devices-pro-table-wrap {
    width: 100% !important;
    max-width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  h1,
  h2,
  h3,
  p,
  span,
  strong,
  small,
  label,
  a,
  td,
  th,
  .text,
  .card-title,
  .page-title {
    overflow-wrap: anywhere !important;
    word-break: normal !important;
  }

  .update-box,
  #updateBox,
  .app-update-box {
    left: max(10px, env(safe-area-inset-left, 0px)) !important;
    right: max(10px, env(safe-area-inset-right, 0px)) !important;
    bottom: max(12px, env(safe-area-inset-bottom, 0px)) !important;
    width: auto !important;
    max-width: none !important;
    z-index: 99999 !important;
  }
}

@media screen and (max-width: 390px) {
  :root {
    --iphone-page-pad: 10px;
  }

  .page-hero-title,
  .dashboard-header h1,
  .topbar h1,
  .main h1 {
    font-size: 22px !important;
  }

  .panel,
  .dashboard-panel,
  .personal-panel,
  .config-section,
  .stock-card,
  .history-card,
  .pc-card,
  .dashboard-card,
  .card,
  .box {
    padding: 13px !important;
    border-radius: 16px !important;
  }
}
/* ===== END APP BRAGA v1.50 ===== */