/* ConfiometroMX App Mode 2.2 — interfaz móvil unificada */
html.cmx-app-mode {
  --cmx-app-bar:#071a2c;
  --cmx-app-accent:#1687d9;
  --cmx-app-soft:#eaf5fd;
  --cmx-app-border:#d8e5ef;
  --cmx-app-text:#10263a;
  --cmx-app-muted:#5f7283;
  --cmx-app-radius:20px;
  --cmx-app-shadow:0 12px 32px rgba(10,45,73,.12);
  color-scheme:light;
}
html.cmx-app-mode body {
  padding-top:calc(58px + env(safe-area-inset-top)) !important;
  padding-bottom:calc(80px + env(safe-area-inset-bottom)) !important;
  overflow-x:hidden;
  background:#f4f8fb !important;
}
html.cmx-app-mode .site-header,
html.cmx-app-mode .public-header,
html.cmx-app-mode .site-footer,
html.cmx-app-mode .public-footer { display:none !important; }

.cmx-app-topbar {
  position:fixed; inset:0 0 auto 0; height:calc(58px + env(safe-area-inset-top));
  padding-top:env(safe-area-inset-top); z-index:2147483000;
  display:flex; align-items:center; gap:8px;
  padding-left:max(10px,env(safe-area-inset-left));
  padding-right:max(10px,env(safe-area-inset-right));
  background:rgba(7,26,44,.97); color:#fff;
  box-shadow:0 8px 24px rgba(0,0,0,.18); backdrop-filter:blur(14px);
  font-family:Manrope,system-ui,sans-serif;
}
.cmx-app-topbar button,.cmx-app-topbar a { border:0; background:transparent; color:inherit; text-decoration:none; cursor:pointer; }
.cmx-app-back,.cmx-app-link-action { width:42px; height:42px; border-radius:13px !important; display:grid; place-items:center; flex:0 0 auto; }
.cmx-app-back { font-size:27px; line-height:1; }
.cmx-app-back:active,.cmx-app-link-action:active { background:rgba(255,255,255,.12); }
.cmx-app-title { min-width:0; flex:1; display:flex; align-items:center; gap:9px; font-weight:800; }
.cmx-app-title img { width:32px; height:32px; object-fit:contain; }
.cmx-app-title-copy { min-width:0; display:flex; flex-direction:column; line-height:1.08; }
.cmx-app-title-copy strong,.cmx-app-title-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cmx-app-title-copy strong { font-size:14px; }
.cmx-app-title-copy small { font-size:10px; color:#bcd2e4; font-weight:600; margin-top:3px; }
.cmx-app-link-action { font-size:20px; }

.cmx-app-bottom {
  position:fixed; z-index:2147483000; left:50%; bottom:max(8px,env(safe-area-inset-bottom));
  transform:translateX(-50%); width:min(680px,calc(100% - 14px)); min-height:66px;
  display:grid; grid-template-columns:repeat(5,1fr); align-items:center; border-radius:21px;
  background:rgba(7,26,44,.98); box-shadow:0 14px 38px rgba(0,0,0,.3); overflow:hidden;
  font-family:Manrope,system-ui,sans-serif; backdrop-filter:blur(14px);
}
.cmx-app-bottom a { color:#c6d7e6; text-decoration:none; min-width:0; min-height:66px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; font-size:10px; font-weight:750; }
.cmx-app-bottom a b { font-size:20px; line-height:1; font-weight:500; }
.cmx-app-bottom a.active { color:#fff; background:linear-gradient(180deg,rgba(22,135,217,.38),rgba(22,135,217,.18)); }
.cmx-app-bottom a.active::before { content:""; position:absolute; top:0; width:30px; height:3px; border-radius:0 0 4px 4px; background:#49b1ff; }
.cmx-app-bottom a { position:relative; }
.cmx-app-toast { position:fixed; z-index:2147483647; left:50%; bottom:94px; transform:translate(-50%,18px); opacity:0; pointer-events:none; max-width:calc(100% - 32px); padding:11px 16px; border-radius:14px; background:#0b2238; color:#fff; box-shadow:0 10px 30px rgba(0,0,0,.28); transition:.2s ease; font:600 14px Manrope,system-ui,sans-serif; text-align:center; }
.cmx-app-toast.show { opacity:1; transform:translate(-50%,0); }

/* Área útil común */
html.cmx-app-mode .public-main { padding:18px 0 28px !important; min-height:auto !important; }
html.cmx-app-mode .public-shell,
html.cmx-app-mode .shell,
html.cmx-app-mode .container { width:min(100% - 24px,1180px) !important; }
html.cmx-app-mode main { min-width:0; }
html.cmx-app-mode h1 { letter-spacing:-.035em; }
html.cmx-app-mode input,
html.cmx-app-mode select,
html.cmx-app-mode textarea,
html.cmx-app-mode button { font-size:16px; }
html.cmx-app-mode .button,
html.cmx-app-mode button[type="submit"] { min-height:48px; border-radius:14px; }
html.cmx-app-mode .auth-card,
html.cmx-app-mode .denue-panel,
html.cmx-app-mode .search-page-card,
html.cmx-app-mode .perspective-card,
html.cmx-app-mode .location-card,
html.cmx-app-mode .general-score-card { border-radius:var(--cmx-app-radius) !important; box-shadow:var(--cmx-app-shadow) !important; }

/* Buscar */
html.cmx-app-mode .search-page-main { padding:18px 0 30px !important; }
html.cmx-app-mode .search-page-content { width:min(100% - 20px,1100px) !important; }
html.cmx-app-mode .search-page-heading { margin:0 0 16px !important; text-align:left !important; }
html.cmx-app-mode .search-page-heading .eyebrow { font-size:11px; }
html.cmx-app-mode .search-page-heading h1 { font-size:clamp(28px,8vw,44px) !important; line-height:1.03 !important; margin:.45rem 0 .7rem !important; }
html.cmx-app-mode .search-page-heading p { font-size:14px !important; line-height:1.55 !important; }
html.cmx-app-mode .search-page-card { padding:14px !important; }
html.cmx-app-mode .search-filter-bar { gap:10px !important; }
html.cmx-app-mode .state-multiselect-toggle { min-height:48px; border-radius:14px; }
html.cmx-app-mode .state-multiselect-menu { position:fixed !important; inset:auto 8px calc(82px + env(safe-area-inset-bottom)) 8px !important; width:auto !important; max-height:min(72vh,620px); border-radius:22px !important; z-index:2147482990 !important; box-shadow:0 20px 60px rgba(0,0,0,.3) !important; }
html.cmx-app-mode .state-options-list { max-height:42vh !important; }
html.cmx-app-mode .company-search-wrap { position:relative; }
html.cmx-app-mode .search-box { display:grid !important; grid-template-columns:42px minmax(0,1fr) !important; gap:0 !important; border-radius:17px !important; overflow:hidden; }
html.cmx-app-mode .search-box svg { margin-left:13px; }
html.cmx-app-mode .search-box input { min-width:0; height:54px !important; padding-right:12px !important; }
html.cmx-app-mode .search-box button { grid-column:1 / -1; width:100%; border-radius:13px !important; margin:4px !important; width:calc(100% - 8px) !important; }
html.cmx-app-mode .search-results { margin-top:10px !important; border-radius:18px !important; max-height:none !important; }
html.cmx-app-mode .search-result-item { padding:14px 12px !important; }
html.cmx-app-mode .search-help { font-size:12px !important; }

/* Ficha empresa */
html.cmx-app-mode .company-hero { padding:18px 0 24px !important; }
html.cmx-app-mode .breadcrumb-row { display:none !important; }
html.cmx-app-mode .hero-grid { grid-template-columns:1fr !important; gap:16px !important; }
html.cmx-app-mode .company-identity { min-width:0; }
html.cmx-app-mode .company-logo { width:70px !important; height:70px !important; }
html.cmx-app-mode .company-identity h1 { font-size:clamp(28px,8vw,42px) !important; overflow-wrap:anywhere; }
html.cmx-app-mode .hero-actions { display:grid !important; grid-template-columns:1fr 1fr; gap:9px !important; }
html.cmx-app-mode .hero-actions .button { width:100%; padding-inline:10px !important; }
html.cmx-app-mode .company-qr-card { grid-column:1 / -1; width:100%; }
html.cmx-app-mode .general-score-card { width:100% !important; min-width:0 !important; }
html.cmx-app-mode .section { padding:28px 0 !important; }
html.cmx-app-mode .section-heading { margin-bottom:16px !important; }
html.cmx-app-mode .section-heading h2 { font-size:25px !important; }
html.cmx-app-mode .perspective-grid,
html.cmx-app-mode .location-grid,
html.cmx-app-mode .denue-contact-grid,
html.cmx-app-mode .methodology-reasons { grid-template-columns:1fr !important; gap:12px !important; }
html.cmx-app-mode .trend-panel { overflow:hidden; border-radius:20px; }
html.cmx-app-mode .trend-chart-wrap { overflow-x:auto; -webkit-overflow-scrolling:touch; }
html.cmx-app-mode .public-map { min-height:330px !important; border-radius:20px !important; }
html.cmx-app-mode .trust-banner { text-align:center; }

/* Establecimiento DENUE */
html.cmx-app-mode .denue-page { width:min(100% - 20px,1050px) !important; margin:16px auto 30px !important; }
html.cmx-app-mode .denue-hero { padding:20px !important; border-radius:22px !important; }
html.cmx-app-mode .denue-hero h1 { font-size:clamp(27px,8vw,42px) !important; line-height:1.05; overflow-wrap:anywhere; }
html.cmx-app-mode .denue-actions { display:grid !important; grid-template-columns:1fr !important; gap:9px !important; }
html.cmx-app-mode .denue-actions .button { width:100%; }
html.cmx-app-mode .denue-grid { grid-template-columns:1fr !important; gap:14px !important; }
html.cmx-app-mode .denue-panel { padding:17px !important; min-width:0; }
html.cmx-app-mode .denue-facts { grid-template-columns:1fr !important; }
html.cmx-app-mode .denue-map { min-height:320px !important; }
html.cmx-app-mode .denue-contact-list a { overflow-wrap:anywhere; }

/* Cuenta, acceso y formularios */
html.cmx-app-mode .auth-layout { display:block !important; min-height:0 !important; padding:0 !important; }
html.cmx-app-mode .auth-card { width:100% !important; max-width:none !important; padding:20px 16px !important; }
html.cmx-app-mode .auth-card h1 { font-size:29px !important; }
html.cmx-app-mode .auth-grid,
html.cmx-app-mode .profile-grid,
html.cmx-app-mode .account-grid { grid-template-columns:1fr !important; }
html.cmx-app-mode label { line-height:1.35; }
html.cmx-app-mode input:not([type="checkbox"]):not([type="radio"]),
html.cmx-app-mode select,
html.cmx-app-mode textarea { width:100%; min-height:49px; border-radius:13px !important; }
html.cmx-app-mode .public-alert { border-radius:15px; margin-bottom:14px; }
html.cmx-app-mode table { display:block; overflow-x:auto; white-space:nowrap; -webkit-overflow-scrolling:touch; }

/* Evaluación */
html.cmx-app-mode .evaluation-shell,
html.cmx-app-mode .evaluation-page,
html.cmx-app-mode .evaluation-container { width:min(100% - 20px,980px) !important; margin-inline:auto !important; }
html.cmx-app-mode .evaluation-card,
html.cmx-app-mode .question-card,
html.cmx-app-mode .success-card { border-radius:20px !important; padding:17px !important; }
html.cmx-app-mode .evaluation-header h1 { font-size:28px !important; }
html.cmx-app-mode .rating-options,
html.cmx-app-mode .option-grid { grid-template-columns:1fr !important; }
html.cmx-app-mode .evaluation-actions { position:sticky; bottom:78px; z-index:20; background:rgba(244,248,251,.94); backdrop-filter:blur(10px); margin-inline:-8px; padding:10px 8px; border-radius:16px; }

@media (max-width:420px){
  .cmx-app-title-copy small{display:none}
  .cmx-app-bottom a span{font-size:9px}
  html.cmx-app-mode .hero-actions{grid-template-columns:1fr}
}
@media (min-width:700px){
  html.cmx-app-mode .search-box { grid-template-columns:46px minmax(0,1fr) auto !important; }
  html.cmx-app-mode .search-box button { grid-column:auto; width:auto !important; margin:4px !important; min-width:130px; }
  html.cmx-app-mode .denue-actions { grid-template-columns:repeat(2,minmax(0,1fr)) !important; }
}
@media (min-width:900px){
  html.cmx-app-mode body{padding-bottom:88px!important}
  .cmx-app-bottom{width:620px}
  .cmx-app-topbar{padding-left:24px;padding-right:24px}
  html.cmx-app-mode .search-page-card{padding:24px!important}
  html.cmx-app-mode .hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,400px)!important}
  html.cmx-app-mode .perspective-grid{grid-template-columns:repeat(3,1fr)!important}
  html.cmx-app-mode .location-grid{grid-template-columns:repeat(2,1fr)!important}
  html.cmx-app-mode .denue-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}