/* Encabezado de bienvenida */ .home-welcome[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #f0f2f5; } .home-welcome__title[data-v-00abecc6] { font-size: 1.75rem; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 8px 0; } .home-welcome__subtitle[data-v-00abecc6] { font-size: 1rem; color: #7f8c8d; margin: 0 0 4px 0; font-weight: 500; } .home-section[data-v-00abecc6]:last-child { margin-bottom: 0; } .home-section--next[data-v-00abecc6] { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; } .home-section--recipe[data-v-00abecc6] { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; margin-top: 8px; margin-bottom: 16px; } .home-section--quick[data-v-00abecc6] { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1; } /* Sección genérica */ .home-section[data-v-00abecc6] { margin-bottom: 28px; } .home-section__title[data-v-00abecc6] { font-size: 1.1rem; font-weight: 600; color: #2c3e50; margin: 0 0 12px 0; text-transform: uppercase; letter-spacing: 0.5px; } /* Grid de accesos rápidos */ .accesos-grid[data-v-00abecc6] { margin: 0 -8px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; } .accesos-grid__col[data-v-00abecc6] { padding: 8px !important; } /* Card de acceso rápido */ .acceso-card[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; padding: 20px 16px; border-radius: var(--radius-xl); border: 1px solid var(--color-border-subtle); border-left: 4px solid; background: linear-gradient(140deg, var(--color-primary-light) 0%, #ffffff 62%); -webkit-box-shadow: 0 8px 24px rgba(18, 130, 162, 0.12); box-shadow: 0 8px 24px rgba(18, 130, 162, 0.12); cursor: pointer; -webkit-transition: border-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease; transition: border-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease; transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, -webkit-transform 0.2s ease, -webkit-box-shadow 0.2s ease; text-align: center; min-height: 140px; } .acceso-card__left[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; } .acceso-card__content[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .acceso-card__chevron[data-v-00abecc6] { display: none; } .acceso-card[data-v-00abecc6]:hover { -webkit-box-shadow: 0 14px 28px rgba(18, 130, 162, 0.18); box-shadow: 0 14px 28px rgba(18, 130, 162, 0.18); border-color: rgba(18, 130, 162, 0.35); -webkit-transform: translateY(-2px); transform: translateY(-2px); } .acceso-card--selected[data-v-00abecc6] { background: linear-gradient(140deg, var(--color-primary) 0%, #0d8fa8 100%); -webkit-box-shadow: 0 10px 28px rgba(18, 130, 162, 0.2); box-shadow: 0 10px 28px rgba(18, 130, 162, 0.2); border: 1px solid var(--color-primary); border-left: 4px solid var(--color-primary); } .acceso-card--selected .acceso-card__title[data-v-00abecc6] { color: #ffffff; font-weight: 700; } .acceso-card--selected .acceso-card__icon[data-v-00abecc6] { color: #ffffff !important; } .acceso-card--selected[data-v-00abecc6]:hover { -webkit-box-shadow: 0 14px 32px rgba(18, 130, 162, 0.28); box-shadow: 0 14px 32px rgba(18, 130, 162, 0.28); -webkit-transform: translateY(-2px); transform: translateY(-2px); } .acceso-card[data-v-00abecc6]:focus { outline: 2px solid var(--color-primary); outline-offset: 2px; } .acceso-card__icon[data-v-00abecc6] { font-size: 48px !important; } .acceso-card__title[data-v-00abecc6] { font-size: 1rem; font-weight: 600; color: var(--color-text-primary); margin: 0; line-height: 1.2; } .acceso-card__action[data-v-00abecc6] { font-size: 0.85rem; color: #7f8c8d; margin: 0; } /* Card de próximo turno */ .proximo-turno-card[data-v-00abecc6] { padding: 14px 18px; border-left-width: 4px !important; } .nt-body[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 14px; } .nt-avatar[data-v-00abecc6] { -ms-flex-negative: 0; flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--color-primary-light); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 2px; } .nt-avatar__icon[data-v-00abecc6] { color: var(--color-primary) !important; font-size: 20px !important; } .nt-info[data-v-00abecc6] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; } .nt-info__topline[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; margin-bottom: 3px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .nt-info__esp[data-v-00abecc6] { font-size: var(--font-size-body); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); } .nt-badge[data-v-00abecc6] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 2px 9px; border: 1px solid; border-radius: 999px; font-size: 0.72rem; font-weight: 600; white-space: nowrap; line-height: 1.6; } .nt-info__medico[data-v-00abecc6] { font-size: var(--font-size-small); color: var(--color-text-secondary); margin-bottom: 5px; } .nt-info__meta[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 12px; font-size: var(--font-size-small); color: var(--color-text-secondary); } .nt-meta-icon[data-v-00abecc6] { color: var(--color-text-muted) !important; font-size: 14px !important; vertical-align: middle; margin-right: 2px; } .nt-actions[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 8px; } .nt-btn[data-v-00abecc6] { text-transform: none !important; letter-spacing: 0 !important; } /* Normalizacion visual: igual que tarjeta de receta */ .proximo-turno-card__header[data-v-00abecc6] { margin-bottom: 12px; } .proximo-turno-card__label[data-v-00abecc6] { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.4px; color: var(--color-text-muted); font-weight: var(--font-weight-semibold); } .proximo-turno-card__details[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; } .proximo-turno-card__detail-row[data-v-00abecc6] { display: grid; grid-template-columns: 100px 1fr; gap: 10px; margin: 0; font-size: 0.85rem; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .proximo-turno-card__label-small[data-v-00abecc6] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.3px; color: var(--color-text-muted); font-weight: var(--font-weight-semibold); } .proximo-turno-card__value[data-v-00abecc6] { color: var(--color-text-primary); } .proximo-turno-card__footer[data-v-00abecc6] { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--color-border-subtle); } .proximo-turno-card__link[data-v-00abecc6] { font-size: 0.8rem; color: var(--color-primary); text-decoration: none; font-weight: var(--font-weight-semibold); -webkit-transition: color 0.2s; transition: color 0.2s; } .proximo-turno-card__link[data-v-00abecc6]:hover { color: var(--color-text-primary); } .proximo-turno-detail[data-v-00abecc6] { display: none; } .proximo-turno-detail__row[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 3px; min-width: 0; } .proximo-turno-detail__key[data-v-00abecc6] { font-size: 0.68rem; text-transform: uppercase; letter-spacing: 0.5px; color: #95a5a6; font-weight: 600; text-align: left; } .proximo-turno-detail__val[data-v-00abecc6] { font-size: 0.88rem; color: #2c3e50; font-weight: 500; line-height: 1.35; overflow-wrap: anywhere; } .proximo-turno-detail__val--estado[data-v-00abecc6] { font-weight: 600; } .proximo-turno-footer[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; border-top: 1px solid #f0f2f5; padding-top: 14px; gap: 8px; } .proximo-turno-actions[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .proximo-turno-action-btn[data-v-00abecc6] { border-radius: 999px !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: var(--font-weight-semibold) !important; min-width: 144px; height: 38px !important; padding: 0 16px !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .proximo-turno-action-btn--primary[data-v-00abecc6] { background: var(--color-primary) !important; border: 1px solid var(--color-primary) !important; color: #ffffff !important; } .proximo-turno-action-btn--primary[data-v-00abecc6]:hover { -webkit-box-shadow: 0 10px 20px rgba(18, 130, 162, 0.22) !important; box-shadow: 0 10px 20px rgba(18, 130, 162, 0.22) !important; -webkit-transform: translateY(-1px); transform: translateY(-1px); } .proximo-turno-action-btn--danger[data-v-00abecc6] { background: var(--color-error) !important; border: 1px solid var(--color-error) !important; color: #ffffff !important; } .proximo-turno-action-btn--danger[data-v-00abecc6]:hover { -webkit-box-shadow: 0 10px 20px rgba(229, 57, 53, 0.22) !important; box-shadow: 0 10px 20px rgba(229, 57, 53, 0.22) !important; -webkit-transform: translateY(-1px); transform: translateY(-1px); } .proximo-turno-action-btn .v-icon[data-v-00abecc6] { font-size: 16px !important; } .proximo-turno-action-btn--primary .v-icon[data-v-00abecc6] { color: #ffffff !important; } .proximo-turno-action-btn--danger .v-icon[data-v-00abecc6] { color: #ffffff !important; } .proximo-turno-action-btn[data-v-00abecc6]:before { opacity: 0 !important; } .proximo-turno-action-btn[data-v-00abecc6]:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; } .proximo-turno-action-btn.v-btn--loading[data-v-00abecc6] { pointer-events: none; } .proximo-turno-action-btn.v-btn--disabled[data-v-00abecc6] { opacity: 0.6; } @media (min-width: 601px) { .home-page[data-v-00abecc6] { height: calc(100vh - 32px); padding-top: 12px; padding-bottom: 16px; overflow-y: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .home-welcome[data-v-00abecc6] { margin-bottom: clamp(4px, 0.8vh, 8px); padding-bottom: clamp(6px, 1vh, 10px); -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .home-welcome__title[data-v-00abecc6] { font-size: clamp(1.45rem, 2vw, 1.7rem); margin-bottom: 6px; } .home-welcome__subtitle[data-v-00abecc6] { font-size: 0.94rem; margin-bottom: 0; } .home-section[data-v-00abecc6] { margin-bottom: clamp(12px, 1.8vh, 18px); -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .home-section--recipe[data-v-00abecc6] { margin-top: 6px; margin-bottom: 12px; } .home-section__title[data-v-00abecc6] { margin-bottom: clamp(8px, 1.2vh, 10px); font-size: 1rem; } .accesos-grid[data-v-00abecc6] { margin: 0 -6px; } .accesos-grid__col[data-v-00abecc6] { padding: 6px !important; } .acceso-card[data-v-00abecc6] { min-height: clamp(86px, 11.2vh, 102px); padding: clamp(10px, 1.4vh, 14px) 12px; gap: 6px; } .acceso-card__icon[data-v-00abecc6] { font-size: clamp(36px, 3.2vw, 44px) !important; } .acceso-card__title[data-v-00abecc6] { font-size: 0.94rem; } .acceso-card__action[data-v-00abecc6] { font-size: 0.8rem; } .proximo-turno-card[data-v-00abecc6] { max-width: 100%; margin-top: 0; padding: clamp(14px, 2vh, 18px) clamp(16px, 1.8vw, 20px) 12px; -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .proximo-turno-card__header[data-v-00abecc6] { margin-bottom: clamp(12px, 1.7vh, 16px); } .proximo-turno-card__eyebrow[data-v-00abecc6] { margin-bottom: 4px; font-size: 0.66rem; } .proximo-turno-card__title[data-v-00abecc6] { font-size: clamp(1.05rem, 1.8vw, 1.18rem); } .proximo-turno-card__status[data-v-00abecc6] { min-height: 28px; padding: 4px 10px; font-size: 0.72rem; } .proximo-turno-detail[data-v-00abecc6] { gap: clamp(8px, 1.3vh, 12px) 18px; margin-bottom: 12px; } .proximo-turno-detail__row[data-v-00abecc6] { gap: 2px; } .proximo-turno-detail__key[data-v-00abecc6] { font-size: 0.64rem; } .proximo-turno-detail__val[data-v-00abecc6] { font-size: 0.84rem; line-height: 1.25; } .proximo-turno-footer[data-v-00abecc6] { padding-top: 8px; } .proximo-turno-actions[data-v-00abecc6] { gap: 6px; } .proximo-turno-action-btn[data-v-00abecc6] { height: 34px !important; min-width: 0; } } /* Responsive */ @media (max-width: 960px) { .home-page[data-v-00abecc6] { padding-top: 64px; } .proximo-turno-card[data-v-00abecc6] { max-width: 100%; padding: 18px 18px 16px; } .proximo-turno-detail[data-v-00abecc6] { grid-template-columns: 1fr; } .acceso-card[data-v-00abecc6] { min-height: 120px; padding: 16px 12px; } .acceso-card__icon[data-v-00abecc6] { font-size: 40px !important; } .acceso-card__title[data-v-00abecc6] { font-size: 0.95rem; } } @media (max-width: 600px) { .home-page[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .home-section--next[data-v-00abecc6] { margin-bottom: 10px; } .home-section--quick[data-v-00abecc6] { margin-top: 1px; margin-bottom: 10px; } .home-page[data-v-00abecc6] { padding-top: 62px; } .home-welcome[data-v-00abecc6] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; margin-bottom: 6px; padding-bottom: 6px; } .home-welcome__title[data-v-00abecc6] { font-size: 1.5rem; } .home-section__title[data-v-00abecc6] { font-size: 0.92rem; margin-bottom: 8px; } .home-section--quick > .home-section__title[data-v-00abecc6] { margin-bottom: 12px; padding-top: 8px; } .home-section--next > .home-section__title[data-v-00abecc6] { display: none; } .home-section--recipe[data-v-00abecc6] { margin-top: 4px; margin-bottom: 10px; } .receta-card[data-v-00abecc6] { padding: 10px 12px; } .receta-card__header[data-v-00abecc6] { margin-bottom: 10px; } .receta-card__detail-row[data-v-00abecc6] { grid-template-columns: 90px 1fr; gap: 8px; font-size: 0.8rem; } .receta-card__detail-row--top[data-v-00abecc6] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .proximo-turno-card__header[data-v-00abecc6] { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 10px; margin-bottom: 10px; } .proximo-turno-card[data-v-00abecc6] { margin-top: 0; padding: 10px 12px 8px; border-left-width: 4px !important; border-radius: 12px; } .proximo-turno-card__label[data-v-00abecc6] { font-size: 1.05rem; font-weight: 700; } .proximo-turno-card__title[data-v-00abecc6] { font-size: 1.05rem; margin-bottom: 2px; } .proximo-turno-card__line[data-v-00abecc6] { font-size: 1rem; margin-bottom: 2px; } .proximo-turno-card__line--title[data-v-00abecc6] { margin-bottom: 6px; } .proximo-turno-card__line-icon[data-v-00abecc6] { font-size: 15px !important; } .proximo-turno-card__line-icon--accent[data-v-00abecc6] { width: 28px; height: 28px; } .proximo-turno-card__status[data-v-00abecc6] { min-height: 22px; padding: 2px 8px; font-size: 0.62rem; } .proximo-turno-card__detail-row[data-v-00abecc6] { grid-template-columns: 90px 1fr; gap: 8px; font-size: 0.8rem; } .proximo-turno-card__detail-row--top[data-v-00abecc6] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .acceso-card[data-v-00abecc6] { min-height: 72px; padding: 12px 12px; gap: 4px; border-radius: 12px; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: left; border-left-width: 3px; } .acceso-card__left[data-v-00abecc6] { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; } .acceso-card__content[data-v-00abecc6] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .acceso-card__icon[data-v-00abecc6] { font-size: 36px !important; } .acceso-card__title[data-v-00abecc6] { font-size: 0.95rem; line-height: 1.15; margin-bottom: 1px; } .acceso-card__action[data-v-00abecc6] { font-size: 0.82rem; line-height: 1.1; text-align: left; } .acceso-card__chevron[data-v-00abecc6] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; color: #7f8c8d; font-size: 20px !important; } .proximo-turno-footer[data-v-00abecc6] { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; padding-top: 8px; gap: 6px; } .proximo-turno-actions[data-v-00abecc6] { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; width: 100%; gap: 6px; } .proximo-turno-action-btn[data-v-00abecc6] { width: calc(50% - 3px); height: 32px !important; padding: 0 10px !important; font-size: 0.72rem; } .proximo-turno-action-btn .v-icon[data-v-00abecc6] { font-size: 13px !important; margin-right: 2px !important; } } /* Tarjeta de receta */ .receta-card[data-v-00abecc6] { padding: 12px 16px; border-left: 4px solid var(--color-primary); cursor: pointer; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .receta-card[data-v-00abecc6]:hover { -webkit-box-shadow: 0 8px 20px rgba(18, 130, 162, 0.14); box-shadow: 0 8px 20px rgba(18, 130, 162, 0.14); -webkit-transform: translateY(-1px); transform: translateY(-1px); } .receta-card__header[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 12px; } .receta-card__label[data-v-00abecc6] { font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.4px; color: var(--color-text-muted); font-weight: var(--font-weight-semibold); } .receta-card__icon-header[data-v-00abecc6] { color: var(--color-primary) !important; font-size: 16px !important; } .receta-card__content[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .receta-card__medicamento[data-v-00abecc6] { padding: 10px; background: var(--color-primary-light); border-radius: 6px; border-left: 3px solid var(--color-primary); } .receta-card__title[data-v-00abecc6] { font-size: 0.9rem; font-weight: var(--font-weight-semibold); color: var(--color-text-primary); margin: 0; } .receta-card__details[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; } .receta-card__detail-row[data-v-00abecc6] { display: grid; grid-template-columns: 100px 1fr; gap: 10px; margin: 0; font-size: 0.85rem; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .receta-card__detail-row--top[data-v-00abecc6] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .receta-card__label-small[data-v-00abecc6] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 0.3px; color: var(--color-text-muted); font-weight: var(--font-weight-semibold); } .receta-card__value[data-v-00abecc6] { color: var(--color-text-primary); } .receta-card__footer[data-v-00abecc6] { margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--color-border-subtle); } .receta-card__link[data-v-00abecc6] { font-size: 0.8rem; color: var(--color-primary); text-decoration: none; font-weight: var(--font-weight-semibold); -webkit-transition: color 0.2s; transition: color 0.2s; } .receta-card__link[data-v-00abecc6]:hover { color: var(--color-text-primary); } /* Overrides Home: protagonismo turno + grid de estudios */ .home-section--next[data-v-00abecc6] { margin-bottom: 20px; } .proximo-turno-card[data-v-00abecc6] { padding: 18px 22px; border-left-width: 6px !important; -webkit-box-shadow: 0 12px 28px rgba(18, 130, 162, 0.14); box-shadow: 0 12px 28px rgba(18, 130, 162, 0.14); } .nt-avatar[data-v-00abecc6] { width: 44px; height: 44px; } .nt-avatar__icon[data-v-00abecc6] { font-size: 24px !important; } .nt-info__esp[data-v-00abecc6] { font-size: 1.1rem; } .nt-info__medico[data-v-00abecc6] { font-size: 0.98rem; } .nt-info__meta[data-v-00abecc6] { font-size: 0.9rem; gap: 14px; } .nt-btn[data-v-00abecc6] { min-width: 142px; } .home-section--records[data-v-00abecc6] { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3; margin-top: 20px; margin-bottom: 12px; } .home-records-grid[data-v-00abecc6] { display: grid; grid-template-columns: 1fr; gap: 12px; } .home-records-grid--two[data-v-00abecc6] { grid-template-columns: repeat(2, minmax(0, 1fr)); } .records-empty[data-v-00abecc6] { padding: 14px 16px; border: 1px solid var(--color-border-subtle); -webkit-box-shadow: none; box-shadow: none; } .records-empty__title[data-v-00abecc6] { margin: 0 0 4px 0; font-size: 1rem; font-weight: var(--font-weight-semibold); color: var(--color-text-primary); } .records-empty__sub[data-v-00abecc6] { margin: 0; font-size: var(--font-size-small); color: var(--color-text-secondary); } .home-record-card[data-v-00abecc6] { height: 100%; padding: 14px 16px; } .orden-home-card[data-v-00abecc6] { border-left: 4px solid var(--color-primary); -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .record-mini[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; } .record-mini__kicker[data-v-00abecc6] { margin: 0; font-size: var(--font-size-small); color: var(--color-text-secondary); } .record-mini__title[data-v-00abecc6] { margin: 0; font-size: 1.55rem; line-height: 1.15; color: var(--color-text-primary); font-weight: var(--font-weight-semibold); } .home-record-card .receta-card__link[data-v-00abecc6] { margin-top: 2px; -ms-flex-item-align: start; align-self: flex-start; } .orden-home-card[data-v-00abecc6]:hover { -webkit-box-shadow: 0 8px 20px rgba(18, 130, 162, 0.14); box-shadow: 0 8px 20px rgba(18, 130, 162, 0.14); -webkit-transform: translateY(-1px); transform: translateY(-1px); } @media (max-width: 960px) { .home-records-grid--two[data-v-00abecc6] { grid-template-columns: 1fr; } .proximo-turno-card[data-v-00abecc6] { padding: 14px 14px; } .record-mini__title[data-v-00abecc6] { font-size: 1.25rem; } .nt-avatar[data-v-00abecc6] { width: 38px; height: 38px; } .nt-info__esp[data-v-00abecc6] { font-size: 1rem; } } /* Ajuste de jerarquia solicitado */ .home-welcome[data-v-00abecc6] { margin-top: 14px; } .home-section--quick[data-v-00abecc6] { margin-top: 10px; } @media (min-width: 601px) { .home-section--next[data-v-00abecc6] { min-height: auto; } } @media (max-width: 600px) { .home-welcome[data-v-00abecc6] { margin-top: 8px; } .home-section--quick[data-v-00abecc6] { margin-top: 8px; } } /* Ajuste visual final segun referencia */ .home-section-caption[data-v-00abecc6] { margin: 0 0 10px 0; font-size: 1rem; font-weight: 700; letter-spacing: 0.4px; color: var(--color-text-secondary); } .home-section--next[data-v-00abecc6] { min-height: auto !important; } .proximo-turno-card[data-v-00abecc6] { display: block; padding: 0; border-left-width: 4px !important; -webkit-box-shadow: none; box-shadow: none; overflow: hidden; min-height: 0; } .proximo-turno-card--empty[data-v-00abecc6] { border-left: 4px solid var(--color-primary); } .nt-strip[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .nt-badge--strip[data-v-00abecc6] { background: transparent !important; font-size: 0.72rem; } .nt-body[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; padding: 14px 16px 10px; } .nt-body--empty[data-v-00abecc6] { padding: 18px 16px; min-height: 140px; } .nt-avatar-initials[data-v-00abecc6] { -ms-flex-negative: 0; flex-shrink: 0; width: 36px; height: 36px; border-radius: 50%; background: var(--color-primary-light); color: var(--color-primary); font-weight: 700; font-size: 0.85rem; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .nt-avatar-initials__icon[data-v-00abecc6] { color: var(--color-primary) !important; font-size: 18px !important; } .nt-info[data-v-00abecc6] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; } .nt-info__esp[data-v-00abecc6] { font-size: var(--font-size-body); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: 1.3; } .nt-info__sub[data-v-00abecc6] { font-size: var(--font-size-small); color: var(--color-text-secondary); margin-top: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .nt-body--empty .nt-info__sub[data-v-00abecc6] { white-space: normal; } .nt-empty-message[data-v-00abecc6] { margin: 0; font-size: 1.1rem; line-height: 1.35; font-weight: var(--font-weight-semibold); color: var(--color-text-primary); max-width: 44ch; } .nt-badge[data-v-00abecc6] { -ms-flex-negative: 0; flex-shrink: 0; font-size: 0.72rem; padding: 3px 10px; font-weight: 600; } .nt-actions[data-v-00abecc6] { border-top: 1px solid var(--color-border-subtle); padding: 10px 16px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; gap: 8px; } .nt-btn[data-v-00abecc6] { text-transform: none !important; letter-spacing: 0 !important; } .home-section--records[data-v-00abecc6] { margin-top: 16px; } .home-record-card[data-v-00abecc6] { padding: 0; border-left: 4px solid var(--color-primary); border-radius: var(--radius-2xl); border-top: 1px solid var(--color-border-subtle); border-right: 1px solid var(--color-border-subtle); border-bottom: 1px solid var(--color-border-subtle); -webkit-box-shadow: none; box-shadow: none; overflow: hidden; } .receta-card.home-record-card[data-v-00abecc6], .orden-home-card[data-v-00abecc6] { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .home-record-strip[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .home-record-strip__fecha[data-v-00abecc6] { font-weight: 600; color: var(--color-text-secondary); } .record-mini[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 0; padding: 14px 16px; } .record-mini__body[data-v-00abecc6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; } .record-mini__content[data-v-00abecc6] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .record-mini__icon[data-v-00abecc6] { width: 36px; height: 36px; border-radius: 50%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; } .record-mini__icon--receta[data-v-00abecc6] { background: #e4f0f0; } .record-mini__icon--receta .v-icon[data-v-00abecc6] { color: #0b7f7b; } .record-mini__icon--orden[data-v-00abecc6] { background: #f6ebdc; } .record-mini__icon--orden .v-icon[data-v-00abecc6] { color: #c07d10; } .record-mini__kicker[data-v-00abecc6] { margin: 0; font-size: var(--font-size-small); color: var(--color-text-secondary); } .record-mini__title[data-v-00abecc6] { margin: 0; font-size: 0.95rem; line-height: 1.3; font-weight: var(--font-weight-semibold); color: var(--color-text-primary); } .home-record-card .receta-card__link[data-v-00abecc6] { color: var(--color-primary); margin-top: 6px; -ms-flex-item-align: start; align-self: flex-start; } @media (max-width: 600px) { .nt-actions[data-v-00abecc6] { -webkit-box-pack: stretch; -ms-flex-pack: stretch; justify-content: stretch; } .nt-btn[data-v-00abecc6] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .nt-info__sub[data-v-00abecc6] { white-space: normal; } } .skeleton-card[data-v-00abecc6] { pointer-events: none; } .skeleton-strip[data-v-00abecc6] { height: 34px; border-bottom: 1px solid var(--color-border-subtle); } .skeleton-block[data-v-00abecc6], .skeleton-line[data-v-00abecc6], .skeleton-btn[data-v-00abecc6] { background: var(--color-surface-page); -webkit-animation: skeleton-pulse-data-v-00abecc6 1.2s ease-in-out infinite; animation: skeleton-pulse-data-v-00abecc6 1.2s ease-in-out infinite; } .skeleton-block[data-v-00abecc6] { border-radius: 50%; } .skeleton-line[data-v-00abecc6] { border-radius: var(--radius-lg); } .skeleton-line--title[data-v-00abecc6] { height: 18px; width: 52%; margin-bottom: 8px; } .skeleton-line--sub[data-v-00abecc6] { height: 14px; width: 72%; } .skeleton-btn[data-v-00abecc6] { width: 120px; height: 32px; border-radius: var(--radius-lg); } .skeleton-line--kicker[data-v-00abecc6] { height: 12px; width: 44%; margin-top: 2px; } .skeleton-line--doc-title[data-v-00abecc6] { height: 22px; width: 66%; } .skeleton-line--link[data-v-00abecc6] { height: 14px; width: 36%; } @-webkit-keyframes skeleton-pulse-data-v-00abecc6 { 0% { opacity: 0.45; } 50% { opacity: 0.9; } 100% { opacity: 0.45; } } @keyframes skeleton-pulse-data-v-00abecc6 { 0% { opacity: 0.45; } 50% { opacity: 0.9; } 100% { opacity: 0.45; } } /* ── Wrapper ── */ .prestaciones-wrap[data-v-35e66f74] { width: 100%; padding: 0 4px; } /* ── Loading / Empty ── */ .prestaciones-loading[data-v-35e66f74] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 16px; } .prestaciones-empty[data-v-35e66f74] { padding: 8px 0; } .prestaciones-empty p[data-v-35e66f74] { font-size: 0.875rem; color: #95a5a6; font-style: italic; margin: 0; } /* ── Cards de prácticas ── */ .practica-cards-wrap[data-v-35e66f74] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; } .practica-card[data-v-35e66f74] { border-radius: 10px !important; border: 1.5px solid #1282a2 !important; background: white; -webkit-transition: border-color 0.15s, background 0.15s; transition: border-color 0.15s, background 0.15s; } .practica-card__title[data-v-35e66f74] { font-size: 0.95rem !important; font-weight: 600 !important; color: #2c3e50 !important; padding-bottom: 4px !important; word-break: normal; } .practica-card__body[data-v-35e66f74] { padding-top: 4px !important; } /* ── Área de servicio ── */ .practica-area[data-v-35e66f74] { font-size: 0.8rem; color: #7f8c8d; margin-bottom: 8px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; } /* ── Tags de condiciones ── */ .practica-tags[data-v-35e66f74] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; } .practica-tag[data-v-35e66f74] { font-size: 0.75rem !important; } /* ── Preparación ── */ .practica-prep[data-v-35e66f74] { font-size: 0.875rem; color: #2c3e50; margin-top: 4px; } .practica-prep__label[data-v-35e66f74] { font-weight: 600; margin-right: 4px; } .practica-prep--none[data-v-35e66f74] { color: #95a5a6; font-style: italic; } /* ── No convenida ── */ .practica-noconvenida[data-v-35e66f74] { font-size: 0.8rem; color: #e74c3c; margin: 6px 0; } .parrafoTerminosCondiciones[data-v-7a98a51d] { text-align: left; padding: 1em 1em 0 1em; } @media screen and (max-width: 600px) { .card-style { width: 100vw; } } .card-style { width: 66vw; } .center-text { text-align: center; } .inline-skeleton { width: 180px; height: 12px; margin: 0 auto; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: inline-skeleton-shimmer 1.4s ease-in-out infinite; animation: inline-skeleton-shimmer 1.4s ease-in-out infinite; } .inline-skeleton--sm { width: 120px; margin-top: 8px; } @-webkit-keyframes inline-skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes inline-skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* ── Tarjeta de turno ── */ .turno-card[data-v-d2fc9300] { margin-bottom: 12px; padding: 0; border-radius: var(--radius-2xl); border-left-width: 6px !important; border-left-style: solid !important; -webkit-transition: -webkit-box-shadow 0.15s; transition: -webkit-box-shadow 0.15s; transition: box-shadow 0.15s; transition: box-shadow 0.15s, -webkit-box-shadow 0.15s; overflow: hidden; } .turno-card--loading[data-v-d2fc9300] { opacity: 0.7; } .card-strip[data-v-d2fc9300] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-d2fc9300] { font-weight: 600; color: var(--color-text-secondary); } /* ── Filas de datos ── */ .turno-detail[data-v-d2fc9300] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .turno-detail__row[data-v-d2fc9300] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .turno-detail__key[data-v-d2fc9300] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .turno-detail__val[data-v-d2fc9300] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } .turno-detail__val--estado[data-v-d2fc9300] { font-weight: 600; } /* ── Footer de la tarjeta ── */ .turno-footer[data-v-d2fc9300] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } /* ── Botones de acción: izquierda ── */ .turno-actions[data-v-d2fc9300] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .turno-action-btn[data-v-d2fc9300] { text-transform: none; letter-spacing: 0; } /* ── Modal de información ── */ .modal-header[data-v-d2fc9300] { padding: 20px 20px 16px; border-bottom: 1px solid #f0f2f5; } .modal-header__title[data-v-d2fc9300] { font-size: 1.1rem; font-weight: 600; color: #2c3e50; margin: 0 0 4px; padding-right: 40px; } .modal-header__subtitle[data-v-d2fc9300] { font-size: 0.8rem; color: #95a5a6; margin: 0; } .modal-prestaciones[data-v-d2fc9300] { padding: 16px 20px 0; } .modal-avisos[data-v-d2fc9300] { margin: 16px 20px; padding: 12px 16px; background: #fff8e1; border-radius: 8px; } .modal-avisos__title[data-v-d2fc9300] { font-size: 0.85rem; font-weight: 600; color: #2c3e50; margin: 0 0 6px; } .modal-avisos__item[data-v-d2fc9300] { font-size: 0.85rem; color: #5f6b7a; margin: 0; } .modal-loading[data-v-d2fc9300] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 16px; } .modal-footer[data-v-d2fc9300] { padding: 12px 20px; border-top: 1px solid #f0f2f5; } /* ── Link calendario: derecha ── */ .turno-calendar-link[data-v-d2fc9300] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #1282a2; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .turno-calendar-link[data-v-d2fc9300]:hover { opacity: 0.75; } @media (max-width: 600px) { .turno-footer[data-v-d2fc9300] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .turno-calendar-link[data-v-d2fc9300] { margin-left: 0; } } /* ── Modal sin scroll — crece con el contenido ── */ .v-dialog > .v-card[data-v-d2fc9300] { overflow: visible !important; } .modal-prestaciones[data-v-d2fc9300] { overflow: visible !important; } .modal-card[data-v-d2fc9300] { padding-bottom: 8px; } .colorHeader[data-v-d2fc9300] { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: #1282A2; } @media (max-width: 600px) { .turno-card[data-v-d2fc9300] { padding: 12px 14px; } .turno-detail__row[data-v-d2fc9300] { grid-template-columns: 104px minmax(0, 1fr); } .modal-detail__key[data-v-d2fc9300] { min-width: 70px; } } .top_buffer { margin-top:20px; } .loading{ text-align: center; margin-top: 20px; } .filtro__cancelado[data-v-26eebcf1]{ margin-left: 32px; } .skeleton-turno-card[data-v-26eebcf1] { padding: 16px 20px; margin-bottom: 12px; border-left: 6px solid #e0e0e0; } .skeleton-turno-card__row[data-v-26eebcf1] { height: 12px; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: skeleton-shimmer-data-v-26eebcf1 1.4s ease-in-out infinite; animation: skeleton-shimmer-data-v-26eebcf1 1.4s ease-in-out infinite; margin-bottom: 10px; } .skeleton-turno-card__row--md[data-v-26eebcf1] { width: 78%; } .skeleton-turno-card__row--sm[data-v-26eebcf1] { width: 60%; margin-bottom: 0; } @-webkit-keyframes skeleton-shimmer-data-v-26eebcf1 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes skeleton-shimmer-data-v-26eebcf1 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .empty-state-card[data-v-26eebcf1] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-26eebcf1] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-26eebcf1] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-26eebcf1] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .filtro__cancelado[data-v-26eebcf1] { margin-left: 0px; } .v-btn[data-v-26eebcf1] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .filtro__cancelado[data-v-9626aa26]{ margin-left: 32px; } .skeleton-turno-card[data-v-9626aa26] { padding: 16px 20px; margin-bottom: 12px; border-left: 6px solid #e0e0e0; } .skeleton-turno-card__row[data-v-9626aa26] { height: 12px; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: skeleton-shimmer-data-v-9626aa26 1.4s ease-in-out infinite; animation: skeleton-shimmer-data-v-9626aa26 1.4s ease-in-out infinite; margin-bottom: 10px; } .skeleton-turno-card__row--md[data-v-9626aa26] { width: 78%; } .skeleton-turno-card__row--sm[data-v-9626aa26] { width: 60%; margin-bottom: 0; } @-webkit-keyframes skeleton-shimmer-data-v-9626aa26 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes skeleton-shimmer-data-v-9626aa26 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .empty-state-card[data-v-9626aa26] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-9626aa26] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-9626aa26] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-9626aa26] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .filtro__cancelado[data-v-9626aa26] { margin-left: 0px; } .load-more-btn.v-btn--outlined[data-v-9626aa26]::before { border-width: 3px !important; } .v-btn[data-v-9626aa26] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .page-header[data-v-939b409c] { margin-bottom: 24px; } .page-title[data-v-939b409c] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-939b409c] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .tabs-citas[data-v-939b409c] { margin-bottom: 16px; border-bottom: 1px solid #e0e0e0; } .tab-text-mobile[data-v-939b409c] { display: none; } @media (max-width: 600px) { .page-container[data-v-939b409c] { padding: 16px 12px 80px; } .tab-text-desktop[data-v-939b409c] { display: none; } .tab-text-mobile[data-v-939b409c] { display: inline; } .tabs-citas[data-v-939b409c] :deep(.v-tab) { min-width: 0 !important; -webkit-box-flex: 1 !important; -ms-flex: 1 1 0px !important; flex: 1 1 0 !important; padding: 0 8px !important; font-size: 0.75rem !important; letter-spacing: 0 !important; height: 48px !important; } .tabs-citas[data-v-939b409c] :deep(.v-tab .v-icon) { margin-right: 4px !important; font-size: 18px !important; } .v-btn[data-v-939b409c] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .horas[data-v-7bb09231] { text-align: center !important; height: 45px !important; width: 40%; } .cal-wrapper[data-v-55776a27] { padding: 0; } .cal-institution-block[data-v-55776a27] { margin-bottom: var(--space-6); } .cal-institution-label[data-v-55776a27] { display: none; } /* Nav bar */ .cal-nav[data-v-55776a27] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: var(--space-2); margin-bottom: var(--space-4); padding: 8px 24px 0; } .cal-nav__range[data-v-55776a27] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; font-size: var(--font-size-body); font-weight: var(--font-weight-medium); color: var(--color-text-primary); } /* Skeleton loading */ .cal-skeleton[data-v-55776a27] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-2) 0 var(--space-4); } .cal-skeleton__pill[data-v-55776a27] { height: 36px; width: 76px; border-radius: var(--radius-pill); } /* Slots layout */ .cal-slots[data-v-55776a27] { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 16px; padding: 0 16px 16px 72px; } .date-group[data-v-55776a27] { min-width: unset; } /* Nav arrows */ .date-nav-arrow[data-v-55776a27] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #d0d7de; background: white; cursor: pointer; -ms-flex-negative: 0; flex-shrink: 0; color: #1282a2; -webkit-transition: background 0.15s; transition: background 0.15s; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); } .date-nav-arrow[data-v-55776a27]:hover:not(:disabled) { background: #eef6fb; } .date-nav-arrow--disabled[data-v-55776a27] { opacity: 0.35; cursor: not-allowed; } .date-group__label[data-v-55776a27] { font-size: var(--font-size-small); font-weight: var(--font-weight-semibold); color: var(--color-text-secondary); margin-bottom: var(--space-2); text-transform: capitalize; white-space: nowrap; } .date-group__chips[data-v-55776a27] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: var(--space-2); } /* Empty / error */ .cal-empty[data-v-55776a27] { text-align: center; padding: var(--space-6) 0; } .cal-error-msg[data-v-55776a27] { color: var(--color-text-muted); font-size: var(--font-size-body); } /* Override HoraPosible button → outlined chip style */ [data-v-55776a27] .horas { border-radius: 10px !important; height: 38px !important; width: 88px !important; min-width: 88px !important; border: 1.5px solid #1282a2 !important; color: #1282a2 !important; background: white !important; font-size: 0.88rem !important; font-weight: 600 !important; letter-spacing: 0 !important; text-transform: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } [data-v-55776a27] .horas:hover { background: #1282a2 !important; color: white !important; } [data-v-55776a27] .horas.selected,[data-v-55776a27] .horas.v-btn--active,[data-v-55776a27] .horas.primary { background: #1282a2 !important; color: white !important; border-color: #1282a2 !important; } .cal-wrapper[data-v-1d28ff89] { padding: var(--space-3) var(--space-4); } .cal-institution-block[data-v-1d28ff89] { margin-bottom: var(--space-5); } .cal-institution-label[data-v-1d28ff89] { font-size: var(--font-size-small); font-weight: var(--font-weight-medium); color: var(--color-text-muted); text-transform: uppercase; letter-spacing: 0.8px; margin-bottom: var(--space-2); } /* Nav bar */ .cal-nav[data-v-1d28ff89] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: var(--space-1); margin-bottom: var(--space-3); } .cal-nav__range[data-v-1d28ff89] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; text-align: center; font-size: var(--font-size-body); font-weight: var(--font-weight-medium); color: var(--color-text-primary); } /* Skeleton loading */ .cal-skeleton[data-v-1d28ff89] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: var(--space-2); padding: var(--space-2) 0 var(--space-3); } .cal-skeleton__pill[data-v-1d28ff89] { height: 44px; width: 76px; border-radius: var(--radius-pill); } /* Slots: horizontally scrollable */ .cal-slots-scroll[data-v-1d28ff89] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: var(--space-5); overflow-x: auto; padding-bottom: var(--space-3); -webkit-overflow-scrolling: touch; } .date-group[data-v-1d28ff89] { -ms-flex-negative: 0; flex-shrink: 0; min-width: 90px; } /* Nav arrows */ .date-nav-arrow[data-v-1d28ff89] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 28px; height: 28px; border-radius: 50%; border: 1.5px solid #d0d7de; background: white; cursor: pointer; -ms-flex-negative: 0; flex-shrink: 0; color: #1282a2; -webkit-transition: background 0.15s; transition: background 0.15s; -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); } .date-nav-arrow[data-v-1d28ff89]:hover:not(:disabled) { background: #eef6fb; } .date-nav-arrow--disabled[data-v-1d28ff89] { opacity: 0.35; cursor: not-allowed; } .date-group__label[data-v-1d28ff89] { font-size: var(--font-size-small); font-weight: var(--font-weight-semibold); color: var(--color-text-secondary); margin-bottom: var(--space-2); text-transform: capitalize; white-space: nowrap; } .date-group__chips[data-v-1d28ff89] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: var(--space-2); } /* Empty / error */ .cal-empty[data-v-1d28ff89] { text-align: center; padding: var(--space-5) 0; } .cal-error-msg[data-v-1d28ff89] { color: var(--color-text-muted); font-size: var(--font-size-body); } /* Override HoraPosible button → touch-friendly pill chip */ [data-v-1d28ff89] .horas { border-radius: var(--radius-pill) !important; height: 44px !important; width: 85px !important; min-width: 85px !important; border: 1.5px solid var(--color-primary) !important; color: var(--color-primary) !important; background-color: var(--color-primary-light) !important; font-size: 13px !important; font-weight: 500 !important; letter-spacing: 0 !important; text-transform: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .separate[data-v-973cbeda] { margin-right: 15px; } .card-style[data-v-973cbeda] { margin: auto; } .marg-top[data-v-973cbeda] { margin-top: 30px; } .white-space-preline[data-v-973cbeda] { white-space: pre-line; } /* ── Page header ── */ .filtros-header[data-v-3ba14ba3] { margin-bottom: var(--space-4); } .filtros-title[data-v-3ba14ba3] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px; } .filtros-subtitle[data-v-3ba14ba3] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } /* ── Booking progress bar ── */ .booking-progress[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; margin-bottom: 24px; } .booking-progress__segment[data-v-3ba14ba3] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 4px; border-radius: 2px; background-color: #e0e0e0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .booking-progress__segment--done[data-v-3ba14ba3] { background-color: #1282a2; } .booking-progress__segment--active[data-v-3ba14ba3] { background-color: #1282a2; } /* ── B1: header row with back arrow ── */ .oferta-header-row[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; gap: 8px; } .oferta-header-row > div[data-v-3ba14ba3] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .oferta-page[data-v-3ba14ba3] { padding: var(--space-4) var(--space-2); } .oferta-loading[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: var(--space-16) 0; } .oferta-header[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: var(--space-3); margin-bottom: var(--space-5); } .oferta-back-btn[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 40px; height: 40px; border-radius: var(--radius-pill); background-color: var(--color-surface-card); border: 1px solid var(--color-border-subtle); cursor: pointer; -ms-flex-negative: 0; flex-shrink: 0; color: var(--color-text-secondary); -webkit-transition: background-color var(--transition-base); transition: background-color var(--transition-base); } .oferta-back-btn[data-v-3ba14ba3]:hover { background-color: var(--color-surface-hover); } .oferta-header__text[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .oferta-breadcrumb[data-v-3ba14ba3] { font-size: var(--font-size-small); color: var(--color-text-muted); line-height: 1; } .oferta-specialty-name[data-v-3ba14ba3] { font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: 1.3; } /* ── Filter bar ─────────────────────────────────── */ .filter-bar[data-v-3ba14ba3] { position: sticky; top: 0; z-index: 10; background: #f0f2f5; padding: 12px 16px; border-bottom: 1px solid rgba(0, 0, 0, 0.08); margin-bottom: var(--space-4); } .filter-bar__search[data-v-3ba14ba3] { margin-bottom: 10px; } .filter-bar__label[data-v-3ba14ba3] { font-size: 0.7rem; text-transform: uppercase; letter-spacing: 1px; color: #95a5a6; margin-bottom: 6px; line-height: 1; } .filter-bar__label--mt[data-v-3ba14ba3] { margin-top: 8px; } .filter-bar__scroll-row[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 6px; overflow-x: auto; -ms-flex-wrap: nowrap; flex-wrap: nowrap; scrollbar-width: none; } .filter-bar__scroll-row[data-v-3ba14ba3]::-webkit-scrollbar { display: none; } .filter-bar__time-row[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 6px; margin-top: 10px; } .time-pill[data-v-3ba14ba3] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border-radius: 99px; padding: 5px 14px; font-size: 0.85rem; cursor: pointer; background: white; border: 1.5px solid #1282a2; color: #1282a2; line-height: 1; -webkit-transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s; } .time-pill--active[data-v-3ba14ba3] { background: #1282a2; color: white; border-color: #1282a2; } /* ── Empty state ───────────────────────────────── */ .modeb-empty[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 48px 16px; gap: 12px; } .modeb-empty__text[data-v-3ba14ba3] { font-size: 1rem; color: #95a5a6; text-align: center; margin-top: 8px; margin-bottom: 0; } .modeb-empty__btn[data-v-3ba14ba3] { border: 1.5px solid #1282a2; color: #1282a2; background: transparent; border-radius: 8px; padding: 8px 20px; font-size: 0.875rem; cursor: pointer; -webkit-transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s; } .modeb-empty__btn[data-v-3ba14ba3]:hover { background: #1282a2; color: white; } /* ── Mode A: doctor cards ──────────────────────── */ .doctor-card[data-v-3ba14ba3] { margin-bottom: var(--space-5); overflow: hidden; -webkit-transition: -webkit-box-shadow 200ms ease; transition: -webkit-box-shadow 200ms ease; transition: box-shadow 200ms ease; transition: box-shadow 200ms ease, -webkit-box-shadow 200ms ease; } .doctor-card[data-v-3ba14ba3]:hover { -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); } .doctor-card--open[data-v-3ba14ba3] { border-bottom-left-radius: 16px; border-bottom-right-radius: 16px; } .doctor-card__calendar[data-v-3ba14ba3] { margin: 0 -16px -16px; } .doctor-card__calendar-divider[data-v-3ba14ba3] { height: 1px; background: #e8ecef; margin: 12px 0 0; } .doctor-card__header[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; padding: 16px; } .doctor-avatar[data-v-3ba14ba3] { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, #1282A2 0%, #034c70 100%); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; color: white; font-size: 16px; font-weight: 700; } .doctor-card__meta[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .doctor-card__name[data-v-3ba14ba3] { font-size: 1rem; font-weight: 600; color: #2c3e50; line-height: 1.3; } .doctor-card__name-separator[data-v-3ba14ba3] { margin: 0 4px; } .doctor-card__specialty[data-v-3ba14ba3] { color: #5f6f7a; font-weight: 500; } .entry-no-slots[data-v-3ba14ba3] { font-size: 0.9rem; color: #95a5a6; padding: 4px 16px 20px; line-height: 1.5; } .entry-no-slots__link[data-v-3ba14ba3] { background: none; border: none; padding: 0; color: #1282a2; font-size: 0.9rem; font-weight: 600; cursor: pointer; text-decoration: underline; } .entry-no-slots__link[data-v-3ba14ba3]:hover { color: #0e6a88; } .doctor-card__sub[data-v-3ba14ba3] { font-size: 0.82rem; color: #95a5a6; line-height: 1.4; margin-top: 1px; } /* ── Próximo turno section ─────────────────────── */ .proximo-turno[data-v-3ba14ba3] { padding: 0 16px 16px; } .proximo-turno__label-row[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 5px; margin-bottom: 8px; } .proximo-turno__label[data-v-3ba14ba3] { font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.6px; color: #95a5a6; line-height: 1; } .proximo-turno__chips[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; } .alt-chip[data-v-3ba14ba3] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1.5px solid #1282a2; color: #1282a2; background: white; border-radius: 10px; padding: 7px 14px; font-size: 0.82rem; font-weight: 600; cursor: pointer; -webkit-transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s; white-space: nowrap; min-width: 64px; } .alt-chip[data-v-3ba14ba3]:hover { background: #1282a2; color: white; } .alt-chip--primary[data-v-3ba14ba3] { background: #1282a2; color: white; } .alt-chip--primary[data-v-3ba14ba3]:hover { background: #0e6e8a; } .alt-chip--more[data-v-3ba14ba3] { border-style: dashed; color: #95a5a6; border-color: #bdc3c7; font-weight: 400; } .alt-chip--more[data-v-3ba14ba3]:hover { background: #f0f2f5; color: #7f8c8d; } /* ── Mobile ────────────────────────────────────── */ @media (max-width: 960px) { .filter-bar[data-v-3ba14ba3] { padding: 12px 16px; } .doctor-avatar[data-v-3ba14ba3] { width: 40px; height: 40px; } } /* ── Slot chips — unificados Mode A y B ───────── */ .proximo-turno__chips[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; padding: 0 16px 16px; } .alt-chip[data-v-3ba14ba3] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1.5px solid #1282a2; color: #1282a2; background: white; border-radius: 10px; padding: 7px 16px; font-size: 0.88rem; font-weight: 600; cursor: pointer; -webkit-transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s; white-space: nowrap; min-width: 80px; } .alt-chip[data-v-3ba14ba3]:hover { background: #1282a2; color: white; } .alt-chip--primary[data-v-3ba14ba3] { background: #1282a2; color: white; } .alt-chip--primary[data-v-3ba14ba3]:hover { background: #0e6e8a; } .alt-chip--more[data-v-3ba14ba3] { border-style: dashed; color: #95a5a6; border-color: #bdc3c7; font-weight: 400; min-width: unset; } .alt-chip--more[data-v-3ba14ba3]:hover { background: #f0f2f5; color: #7f8c8d; } /* ── Mode B grouped chips ──────────────────────── */ .modeb-chips[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; padding: 0 16px 16px; } .modeb-chip[data-v-3ba14ba3] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border: 1.5px solid #1282a2; color: #1282a2; background: white; border-radius: 10px; padding: 7px 16px; font-size: 0.88rem; font-weight: 600; cursor: pointer; -webkit-transition: background 0.15s, color 0.15s; transition: background 0.15s, color 0.15s; white-space: nowrap; min-width: 80px; } .modeb-chip[data-v-3ba14ba3]:hover { background: #1282a2; color: white; } .modeb-chip--more[data-v-3ba14ba3] { border-style: dashed; color: #95a5a6; border-color: #bdc3c7; font-weight: 400; min-width: unset; } .modeb-chip--more[data-v-3ba14ba3]:hover { background: #f0f2f5; color: #7f8c8d; } /* ── Loading state ─────────────────────────────── */ .oferta-loading-state[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 12px; padding: 4px 0; } .loading-message-card[data-v-3ba14ba3] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-3ba14ba3] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-3ba14ba3 1.6s ease-in-out infinite; animation: loading-bar-data-v-3ba14ba3 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-3ba14ba3 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-3ba14ba3 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__title[data-v-3ba14ba3] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-3ba14ba3] { font-size: 0.82rem; color: #5a9ab5; } /* Skeleton base */ .skeleton[data-v-3ba14ba3] { background: -webkit-gradient(linear, left top, right top, color-stop(25%, #e8ecef), color-stop(50%, #f5f7f8), color-stop(75%, #e8ecef)); background: linear-gradient(90deg, #e8ecef 25%, #f5f7f8 50%, #e8ecef 75%); background-size: 200% 100%; -webkit-animation: shimmer-data-v-3ba14ba3 1.4s ease-in-out infinite; animation: shimmer-data-v-3ba14ba3 1.4s ease-in-out infinite; border-radius: 6px; } @-webkit-keyframes shimmer-data-v-3ba14ba3 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes shimmer-data-v-3ba14ba3 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* Skeleton card */ .skeleton-card[data-v-3ba14ba3] { background: white; border-radius: 14px; -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.06); box-shadow: 0 2px 8px rgba(0,0,0,0.06); padding: 16px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 14px; } .skeleton-card__header[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; } .skeleton-card__avatar[data-v-3ba14ba3] { width: 44px; height: 44px; border-radius: 50%; -ms-flex-negative: 0; flex-shrink: 0; } .skeleton-card__meta[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .skeleton-card__name[data-v-3ba14ba3] { height: 14px; width: 55%; } .skeleton-card__sub[data-v-3ba14ba3] { height: 11px; width: 38%; } .skeleton-card__chips[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 8px; } .skeleton-card__chip[data-v-3ba14ba3] { height: 34px; width: 110px; border-radius: 10px; } /* ── Carrusel de fechas ────────────────────────── */ .carousel-wrapper[data-v-3ba14ba3] { width: 100%; } .carousel-row[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; -ms-flex-wrap: nowrap; flex-wrap: nowrap; } /* Base de todos los botones del carrusel */ .carousel-btn[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; width: 56px; height: 68px; border-radius: 12px; border: 1.5px solid #d0d7de; background: white; cursor: pointer; -webkit-transition: border-color 0.15s, background 0.15s, color 0.15s; transition: border-color 0.15s, background 0.15s, color 0.15s; gap: 2px; padding: 0; font-family: inherit; } /* Días normales */ .carousel-btn--day[data-v-3ba14ba3]:hover { border-color: #1282a2; } .carousel-btn--active[data-v-3ba14ba3] { background: #1282a2; border-color: #1282a2; } /* Textos dentro del día */ .carousel-btn__month[data-v-3ba14ba3] { font-size: 0.65rem; text-transform: uppercase; letter-spacing: 0.5px; color: #95a5a6; line-height: 1; } .carousel-btn--active .carousel-btn__month[data-v-3ba14ba3] { color: rgba(255, 255, 255, 0.75); } .carousel-btn__num[data-v-3ba14ba3] { font-size: 1.2rem; font-weight: 700; color: #2c3e50; line-height: 1.15; } .carousel-btn--active .carousel-btn__num[data-v-3ba14ba3] { color: white; } .carousel-btn__day[data-v-3ba14ba3] { font-size: 0.65rem; color: #95a5a6; line-height: 1; } .carousel-btn--active .carousel-btn__day[data-v-3ba14ba3] { color: rgba(255, 255, 255, 0.75); } /* Botones de navegación (Volver / Ver más) */ .carousel-btn--nav[data-v-3ba14ba3] { border-style: dashed; border-color: #1282a2; color: #1282a2; gap: 4px; } .carousel-btn--nav[data-v-3ba14ba3]:hover { background: #eef6fb; } .carousel-btn--nav[data-v-3ba14ba3]:disabled { opacity: 0.6; cursor: not-allowed; } .carousel-btn__arrow[data-v-3ba14ba3] { font-size: 1rem; line-height: 1; } .carousel-btn__label[data-v-3ba14ba3] { font-size: 0.6rem; text-transform: uppercase; letter-spacing: 0.5px; line-height: 1; } .date-card-skeleton[data-v-3ba14ba3] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-negative: 0; flex-shrink: 0; width: 52px; height: 64px; border-radius: 12px; border: 1.5px solid #e8ecef; background: white; gap: 5px; padding: 8px 0; } .date-card-skeleton__month[data-v-3ba14ba3] { width: 28px; height: 8px; border-radius: 4px; } .date-card-skeleton__num[data-v-3ba14ba3] { width: 22px; height: 20px; border-radius: 4px; } .date-card-skeleton__day[data-v-3ba14ba3] { width: 20px; height: 8px; border-radius: 4px; } /* ── Fade transition ───────────────────────────── */ .fade-enter-active[data-v-3ba14ba3] { -webkit-transition: opacity 0.4s ease; transition: opacity 0.4s ease; } .fade-enter[data-v-3ba14ba3] { opacity: 0; } /* ── Page layout ──────────────────────────────────────────── */ .filtros-page[data-v-5debe05f] { padding: var(--space-4) var(--space-8) 80px; } /* ── Header ───────────────────────────────────────────────── */ .filtros-header[data-v-5debe05f] { margin-bottom: var(--space-4); } .filtros-title[data-v-5debe05f] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px; } .filtros-subtitle[data-v-5debe05f] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } /* ── Mode toggle ──────────────────────────────────────────── */ .mode-toggle-wrap[data-v-5debe05f] { margin-bottom: var(--space-4); } .mode-toggle[data-v-5debe05f] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; background-color: var(--color-primary-light); border-radius: var(--radius-pill); padding: 4px; gap: 2px; } .mode-toggle__btn[data-v-5debe05f] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 6px; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 148px; padding: 8px var(--space-4); border: none; background: transparent; border-radius: var(--radius-pill); font-family: var(--font-family-base); font-size: var(--font-size-body); color: var(--color-text-muted); cursor: pointer; -webkit-transition: all var(--transition-base); transition: all var(--transition-base); white-space: nowrap; outline: none; } .mode-toggle__btn--active[data-v-5debe05f] { background: var(--color-surface-card); color: var(--color-primary); font-weight: var(--font-weight-semibold); -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12); } .mode-toggle__btn--active .mode-toggle__icon[data-v-5debe05f] { color: var(--color-primary) !important; } /* ── Search card ──────────────────────────────────────────── */ .filtros-card[data-v-5debe05f] { padding: var(--space-6); margin-bottom: var(--space-4); position: relative; overflow: visible; } .filtros-card.app-card[data-v-5debe05f] { border-radius: var(--radius-2xl); overflow: visible; } /* ── Filter row (institution + practice at top) ───────────── */ .filtros-row[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: var(--space-3); margin-bottom: var(--space-4); } .filtros-row__col[data-v-5debe05f] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-width: 0; } /* ── Divider between filter row and search ────────────────── */ .filtros-divider[data-v-5debe05f] { margin: 0 0 var(--space-4); } .filtros-divider--between[data-v-5debe05f] { margin-top: var(--space-4); } /* ── Inputs ───────────────────────────────────────────────── */ .filtros-input[data-v-5debe05f] .v-input__control { min-height: 44px; } .filtros-input[data-v-5debe05f] input, .filtros-input[data-v-5debe05f] .v-select__selection { font-size: var(--font-size-body) !important; color: var(--color-text-primary) !important; } .filtros-input[data-v-5debe05f] .v-label { font-size: var(--font-size-body) !important; } .filtros-input[data-v-5debe05f] .v-input__slot fieldset { border-radius: var(--radius-md) !important; } .filtros-search-input[data-v-5debe05f] { margin-bottom: var(--space-2); } .filtros-input--top-gap[data-v-5debe05f] { margin-top: var(--space-3); } /* ── Specialty custom selector ────────────────────────────── */ .esp-selector[data-v-5debe05f] { position: relative; margin-bottom: var(--space-2); width: 100%; } .esp-selector__field[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; padding: 10px 12px; border: 1px solid rgba(0, 0, 0, 0.38); border-radius: 4px; cursor: pointer; background: white; min-height: 44px; width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: border-color 0.2s; transition: border-color 0.2s; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .esp-selector__field--top[data-v-5debe05f] { min-height: 56px; padding: 14px 12px; border-radius: var(--radius-md); } .esp-selector__field[data-v-5debe05f]:hover { border-color: rgba(0, 0, 0, 0.87); } .esp-selector__field--active[data-v-5debe05f] { border-color: var(--color-primary); border-width: 2px; } .esp-selector__field--selected[data-v-5debe05f] { border-color: var(--color-primary); } .esp-selector__field--disabled[data-v-5debe05f] { opacity: 0.5; pointer-events: none; background: #f5f5f5; } .esp-selector__icon[data-v-5debe05f] { color: var(--color-text-muted) !important; -ms-flex-negative: 0; flex-shrink: 0; pointer-events: none; } .esp-selector__icon--top[data-v-5debe05f] { font-size: 26px !important; color: var(--color-text-secondary) !important; } .esp-selector__input[data-v-5debe05f] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; border: none; outline: none; font-size: var(--font-size-body); color: var(--color-text-primary); background: transparent; min-width: 0; } .esp-selector__input[data-v-5debe05f]::-webkit-input-placeholder { color: var(--color-text-muted); } .esp-selector__input[data-v-5debe05f]::-moz-placeholder { color: var(--color-text-muted); } .esp-selector__input[data-v-5debe05f]:-ms-input-placeholder { color: var(--color-text-muted); } .esp-selector__input[data-v-5debe05f]::-ms-input-placeholder { color: var(--color-text-muted); } .esp-selector__input[data-v-5debe05f]::placeholder { color: var(--color-text-muted); } .esp-selector__display[data-v-5debe05f] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; cursor: pointer; pointer-events: none; font-size: var(--font-size-body); color: var(--color-text-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .esp-selector__field--selected .esp-selector__display[data-v-5debe05f] { color: var(--color-text-primary); } .esp-selector__clear[data-v-5debe05f] { -ms-flex-negative: 0; flex-shrink: 0; color: var(--color-text-muted) !important; pointer-events: all; cursor: pointer; } .esp-selector__chevron[data-v-5debe05f] { -ms-flex-negative: 0; flex-shrink: 0; color: var(--color-text-muted) !important; pointer-events: none; } .esp-selector__clear[data-v-5debe05f]:hover { color: var(--color-text-primary) !important; } .esp-selector__dropdown[data-v-5debe05f] { position: absolute; top: calc(100% + 4px); left: 0; right: 0; background: white; border: 1px solid rgba(0, 0, 0, 0.12); border-radius: 4px; -webkit-box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12); z-index: 500; max-height: 280px; overflow-y: auto; } .esp-selector__item[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; padding: 12px 16px; cursor: pointer; font-size: var(--font-size-body); color: var(--color-text-primary); border-bottom: 1px solid var(--color-border-subtle); -webkit-transition: background-color 0.15s; transition: background-color 0.15s; } .esp-selector__item[data-v-5debe05f]:last-child { border-bottom: none; } .esp-selector__item[data-v-5debe05f]:hover { background-color: var(--color-primary-light); } .esp-selector__item--selected[data-v-5debe05f] { background-color: var(--color-primary-light); color: var(--color-primary); font-weight: var(--font-weight-semibold); } .esp-selector__item-check[data-v-5debe05f] { color: var(--color-primary) !important; -ms-flex-negative: 0; flex-shrink: 0; } .esp-selector__loading[data-v-5debe05f], .esp-selector__empty[data-v-5debe05f] { padding: 10px 12px; } .esp-selector__loading-line[data-v-5debe05f] { height: 10px; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; margin-bottom: 8px; } .esp-selector__loading-line--sm[data-v-5debe05f] { width: 62%; margin-bottom: 0; } @-webkit-keyframes esp-loading-shimmer-data-v-5debe05f { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes esp-loading-shimmer-data-v-5debe05f { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .esp-selector__empty[data-v-5debe05f] { font-size: var(--font-size-small); color: var(--color-text-muted); } /* ── Skeleton loading (filters row) ──────────────────────── */ .filtros-skeleton-row[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: var(--space-3); padding: var(--space-4) 0; } .filtros-skeleton-col[data-v-5debe05f] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 8px; } .filtros-skeleton-field[data-v-5debe05f] { height: 44px; border-radius: 4px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; } .filtros-skeleton-subtext[data-v-5debe05f] { height: 8px; width: 70%; border-radius: 4px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; animation: esp-loading-shimmer-data-v-5debe05f 1.4s ease-in-out infinite; } /* ── Doctor search results ────────────────────────────────── */ .doctor-list[data-v-5debe05f] { margin: 0 calc(-1 * var(--space-3)); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-md); overflow: hidden; } .doctor-list__item[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 12px 16px; cursor: pointer; border-bottom: 1px solid var(--color-border-subtle); -webkit-transition: background-color var(--transition-fast); transition: background-color var(--transition-fast); -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .doctor-list__item[data-v-5debe05f]:last-child { border-bottom: none; } .doctor-list__item[data-v-5debe05f]:hover { background-color: var(--color-primary-light); } .doctor-list__icon[data-v-5debe05f] { color: var(--color-text-muted) !important; margin-right: var(--space-2); -ms-flex-negative: 0; flex-shrink: 0; } .doctor-list__name[data-v-5debe05f] { font-size: var(--font-size-body); color: var(--color-text-primary); } .doctor-chip-wrap[data-v-5debe05f] { padding: var(--space-2) 0 0; } .auto-esp-badge[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-top: var(--space-2); padding: var(--space-2) var(--space-3); background-color: var(--color-surface-page); border-radius: var(--radius-md); font-size: var(--font-size-small); color: var(--color-text-muted); } .field--selected[data-v-5debe05f] .v-input__slot { background-color: var(--color-primary-light) !important; } .field--selected[data-v-5debe05f] input { color: var(--color-primary) !important; font-weight: var(--font-weight-semibold); } .filtros-hint--error[data-v-5debe05f] { color: var(--color-error) !important; } .filtros-validation[data-v-5debe05f] { font-size: var(--font-size-small); color: var(--color-error); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: var(--space-2) 0 0; } /* ── Hint text ────────────────────────────────────────────── */ .filtros-hint[data-v-5debe05f] { font-size: var(--font-size-small); color: var(--color-text-muted); line-height: var(--line-height-base); margin: var(--space-3) 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } /* ── Clear filters row ────────────────────────────────────── */ .filtros-clear-row[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-bottom: var(--space-2); } .filtros-clear-btn[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: none; border: none; cursor: pointer; font-size: 0.75rem; color: var(--color-text-muted); padding: 4px 8px; border-radius: var(--radius-sm); -webkit-transition: color 0.2s, background-color 0.2s; transition: color 0.2s, background-color 0.2s; } .filtros-clear-btn[data-v-5debe05f]:hover { color: var(--color-text-primary); background-color: var(--color-border-subtle); } /* ── Filter chips ─────────────────────────────────────────── */ .filtros-chips[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-3); } /* ── Sticky action button ─────────────────────────────────── */ .filtros-action[data-v-5debe05f] { position: sticky; bottom: 0; background-color: var(--color-surface-page); border-top: 1px solid var(--color-border-subtle); padding: var(--space-4) var(--space-8); margin: 0 calc(-1 * var(--space-8)); z-index: 10; } .filtros-action__btn[data-v-5debe05f] { border-radius: var(--radius-md) !important; height: 52px !important; text-transform: none !important; font-size: var(--font-size-body) !important; font-weight: var(--font-weight-semibold) !important; letter-spacing: 0.5px !important; } .filtros-action__hint[data-v-5debe05f] { text-align: center; font-size: 0.8rem; color: var(--color-text-muted); margin-top: var(--space-2); margin-bottom: 0; } /* ── Mobile ───────────────────────────────────────────────── */ @media (max-width: 600px) { .filtros-page[data-v-5debe05f] { padding: var(--space-4) var(--space-4) 80px; } .mode-toggle[data-v-5debe05f] { width: 100%; } .mode-toggle__btn[data-v-5debe05f] { min-width: 0; font-size: 0.9rem; padding: 8px var(--space-3); } .filtros-card[data-v-5debe05f] { padding: var(--space-4); } .filtros-row[data-v-5debe05f] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: var(--space-2); margin-bottom: var(--space-3); } .filtros-action[data-v-5debe05f] { margin: 0 calc(-1 * var(--space-4)); padding: var(--space-4); } } /* ── Booking progress bar ── */ .booking-progress[data-v-5debe05f] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; margin-bottom: 24px; } .booking-progress__segment[data-v-5debe05f] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 4px; border-radius: 2px; background-color: #e0e0e0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .booking-progress__segment--done[data-v-5debe05f] { background-color: #1282a2; } .booking-progress__segment--active[data-v-5debe05f] { background-color: #1282a2; } /* ── Page header ── */ .filtros-header[data-v-7b6caee1] { margin-bottom: var(--space-4); } .filtros-title[data-v-7b6caee1] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px; } .filtros-subtitle[data-v-7b6caee1] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } /* ── Booking progress bar ── */ .booking-progress[data-v-7b6caee1] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; margin-bottom: 24px; } .booking-progress__segment[data-v-7b6caee1] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 4px; border-radius: 2px; background-color: #e0e0e0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .booking-progress__segment--done[data-v-7b6caee1] { background-color: #1282a2; } .booking-progress__segment--active[data-v-7b6caee1] { background-color: #1282a2; } .card-style[data-v-7b6caee1] { margin: auto; } .centrar[data-v-7b6caee1] { text-align: center; } .separate[data-v-7b6caee1] { margin-right: 15px; } .marg-top[data-v-7b6caee1] { margin-top: 30px; } .marg[data-v-7b6caee1] { margin: 20px 0px; } .pad-col-left[data-v-7b6caee1] { padding-left: 10px; } .no-pad-btn[data-v-7b6caee1] { padding-bottom: 0px; } .no-pad-top[data-v-7b6caee1] { padding-top: 0px; word-break: break-word; } .error-title[data-v-7b6caee1] { word-break: break-word; font-weight: 400; font-size: 20px; } @media (max-width: 600px) { .error-title[data-v-7b6caee1] { font-size: 16px; } .v-toolbar__title[data-v-7b6caee1] { font-size: 1rem; } } /* ── Page header ── */ .filtros-header[data-v-264561fe] { margin-bottom: var(--space-4); } .filtros-title[data-v-264561fe] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px; } .filtros-subtitle[data-v-264561fe] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } /* ── Booking progress bar ── */ .booking-progress[data-v-264561fe] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; margin-bottom: 24px; } .booking-progress__segment[data-v-264561fe] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 4px; border-radius: 2px; background-color: #e0e0e0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .booking-progress__segment--done[data-v-264561fe] { background-color: #1282a2; } .booking-progress__segment--active[data-v-264561fe] { background-color: #1282a2; } /* ── Layout ── */ .prestaciones-page[data-v-264561fe] { width: 100%; } .prestaciones-content[data-v-264561fe] { width: 100%; } /* ── Turno summary chips ── */ .turno-summary[data-v-264561fe] { margin-bottom: 16px; } .turno-summary__label[data-v-264561fe] { font-size: var(--font-size-small); color: var(--color-text-muted); font-weight: var(--font-weight-semibold); text-transform: uppercase; letter-spacing: 0.5px; display: block; margin-bottom: 8px; } .turno-chips[data-v-264561fe] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; } .turno-chip[data-v-264561fe] { font-size: 0.85rem; } /* ── Prácticas ── */ .practica-checkbox-div[data-v-264561fe] { width: 100%; margin: 0.4rem 0; border-radius: 10px; border: 2px solid #1282A2; background-color: white; } .practica-checkbox[data-v-264561fe] { color: black; border-radius: 5px; height: -webkit-fit-content; height: -moz-fit-content; height: fit-content; margin-left: 1rem; } .practica-checkbox[data-v-264561fe] label { margin-left: 0.5rem; color: #212121; } .mensaje-prestaciones[data-v-264561fe] { margin: 0.5rem 0; font-style: italic; font-size: var(--font-size-small); color: var(--color-text-muted); } /* ── Botones ── */ .botonera[data-v-264561fe] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 16px; margin-top: 16px; } .prestacion-btn[data-v-264561fe] { min-width: 120px; } .info-practicas[data-v-65a91f4e] { width: 100%; } /* ── Page header ── */ .filtros-header[data-v-65a91f4e] { margin-bottom: var(--space-4); } .filtros-title[data-v-65a91f4e] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px; } .filtros-subtitle[data-v-65a91f4e] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } /* ── Booking progress bar ── */ .booking-progress[data-v-65a91f4e] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 4px; margin-bottom: 24px; } .booking-progress__segment[data-v-65a91f4e] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 4px; border-radius: 2px; background-color: #e0e0e0; -webkit-transition: background-color 0.3s; transition: background-color 0.3s; } .booking-progress__segment--done[data-v-65a91f4e] { background-color: #1282a2; } .booking-progress__segment--active[data-v-65a91f4e] { background-color: #1282a2; } .card-content[data-v-65a91f4e] { padding: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 16px; } .turno-summary[data-v-65a91f4e] { margin-bottom: 16px; } .turno-summary__label[data-v-65a91f4e] { font-size: var(--font-size-small); color: var(--color-text-muted); font-weight: var(--font-weight-semibold); text-transform: uppercase; letter-spacing: 0.5px; display: block; margin-bottom: 8px; } .turno-chips[data-v-65a91f4e] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; } .turno-chip[data-v-65a91f4e] { font-size: 0.85rem; } .practica-cards-wrap[data-v-65a91f4e] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; } .practica-card[data-v-65a91f4e] { width: 100%; cursor: pointer; border-radius: 12px !important; border: 1.5px solid #e0e0e0 !important; background: white; -webkit-transition: border-color 0.15s, background 0.15s; transition: border-color 0.15s, background 0.15s; } .practica-card--selected[data-v-65a91f4e] { border-color: #1282a2 !important; background: #eef6fb !important; } .practica-card__title[data-v-65a91f4e] { font-size: 0.95rem !important; font-weight: 600; padding: 14px 16px !important; color: #2c3e50; } .practica-card__body[data-v-65a91f4e] { padding: 0 16px 14px !important; } .practica-prep[data-v-65a91f4e] { font-size: 0.85rem; color: #666; } .practica-prep__label[data-v-65a91f4e] { font-weight: 600; color: #444; } .practica-prep--none[data-v-65a91f4e] { font-style: italic; color: #aaa; } .practica-area[data-v-65a91f4e] { font-size: 0.82rem; color: #666; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; margin-bottom: 6px; } .practica-tags[data-v-65a91f4e] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; } .practica-noconvenida[data-v-65a91f4e] { font-size: 0.82rem; color: #c62828; margin-top: 4px; } .practica-particularidades[data-v-65a91f4e] { border-top: 1px solid #eee; padding-top: 8px; margin-top: 4px; } .avisos-section[data-v-65a91f4e] { background: #fff8e1; border-radius: 8px; padding: 12px 14px; font-size: 0.85rem; color: #5d4037; } .avisos-title[data-v-65a91f4e] { font-weight: 600; margin-bottom: 4px; font-size: 0.9rem; } .botonera[data-v-65a91f4e] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; padding-top: 4px; } .prestacion-btn[data-v-65a91f4e] { min-width: 130px; font-weight: 600 !important; } .seleccion-requerida[data-v-65a91f4e] { text-align: center; color: #e53935; font-size: 0.83rem; margin-top: 4px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 4px; } @media (max-width: 600px) { .prestacion-btn[data-v-65a91f4e] { min-width: 100px; } } @media screen and (max-width: 600px) { .card-style { width: 100%; } } .card-style { margin: auto; min-width: 60%; } .center-text { text-align: center; } .inline-skeleton { width: 180px; height: 12px; margin: 0 auto; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: inline-skeleton-shimmer 1.4s ease-in-out infinite; animation: inline-skeleton-shimmer 1.4s ease-in-out infinite; } @-webkit-keyframes inline-skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes inline-skeleton-shimmer { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .centrar-conte { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .wizard-nav { display: none !important; } .wizard-progress-bar { display: none !important; } .wizard-header { padding: 0px !important; } .wizard-tab-content { padding-top: 0px !important; } .no-button { display: none !important; } @media (max-width: 600px) { .vue-form-wizard .wizard-tab-content { padding: 0px !important; } } .titulo-card[data-v-63b5e318] { font-size: 16px; } .hora-card[data-v-63b5e318] { font-size: 16px !important; } .right-things[data-v-63b5e318] { display: block; } .marg[data-v-63b5e318] { margin: 20px 0px; } .no-pad[data-v-63b5e318] { padding-left: 0px; } .divide-cols[data-v-63b5e318] { border-right: grey 1px solid; } .pad-col-left[data-v-63b5e318] { padding-left: 10px; } .line[data-v-63b5e318] { padding-bottom: 5px; } @media (max-width: 600px) { .divide-cols[data-v-63b5e318] { border-right: 0px; border-bottom: 1px solid grey !important; } .pad-col-left[data-v-63b5e318] { padding-left: 0px; padding-top: 10px; } .no-pad[data-v-63b5e318] { position: relative; top: 10px; left: 205px; } } .col-cal { -moz-text-align-last: center; text-align-last: center; } .page-header[data-v-d6fcaf2e] { margin-bottom: 24px; } .page-title[data-v-d6fcaf2e] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-d6fcaf2e] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .receta-card[data-v-d9adb75c] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; } .card-strip[data-v-d9adb75c] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-d9adb75c] { font-weight: 600; color: var(--color-text-secondary); } .receta-detail[data-v-d9adb75c] { padding: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .receta-detail__row[data-v-d9adb75c] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .receta-detail__row--top[data-v-d9adb75c] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .receta-detail__key[data-v-d9adb75c] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .receta-detail__val[data-v-d9adb75c] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } /* ── Footer: botones + WhatsApp ── */ .receta-footer[data-v-d9adb75c] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .receta-actions[data-v-d9adb75c] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .receta-action-btn[data-v-d9adb75c] { text-transform: none; letter-spacing: 0; } .receta-whatsapp-link[data-v-d9adb75c] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #25D366; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .receta-whatsapp-link[data-v-d9adb75c]:hover { opacity: 0.75; } .receta-loading-dot[data-v-d9adb75c] { width: 12px; height: 12px; border-radius: 50%; background: #25D366; display: inline-block; -webkit-animation: receta-loading-pulse-data-v-d9adb75c 1.1s ease-in-out infinite; animation: receta-loading-pulse-data-v-d9adb75c 1.1s ease-in-out infinite; } @-webkit-keyframes receta-loading-pulse-data-v-d9adb75c { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @keyframes receta-loading-pulse-data-v-d9adb75c { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @media (max-width: 600px) { .receta-detail__row[data-v-d9adb75c] { grid-template-columns: 104px minmax(0, 1fr); } .receta-footer[data-v-d9adb75c] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .receta-whatsapp-link[data-v-d9adb75c] { margin-left: 0; } } .page-header[data-v-8d7a5688] { margin-bottom: 24px; } .page-title[data-v-8d7a5688] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-8d7a5688] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .loading-message-card[data-v-8d7a5688] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-8d7a5688] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-8d7a5688 1.6s ease-in-out infinite; animation: loading-bar-data-v-8d7a5688 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-8d7a5688 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-8d7a5688 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-8d7a5688] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-8d7a5688] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-8d7a5688] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-8d7a5688] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-8d7a5688] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-8d7a5688] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-8d7a5688] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-8d7a5688] { padding: 16px 12px 80px; } .v-btn[data-v-8d7a5688] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .orden-card[data-v-a2193eb6] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; } .card-strip[data-v-a2193eb6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-a2193eb6] { font-weight: 600; color: var(--color-text-secondary); } .orden-detail[data-v-a2193eb6] { padding: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .orden-detail__row[data-v-a2193eb6] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .orden-detail__key[data-v-a2193eb6] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .orden-detail__val[data-v-a2193eb6] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } /* ── Footer: botones + WhatsApp ── */ .orden-footer[data-v-a2193eb6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .orden-actions[data-v-a2193eb6] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .orden-action-btn[data-v-a2193eb6] { text-transform: none; letter-spacing: 0; } .orden-whatsapp-link[data-v-a2193eb6] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #25D366; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .orden-whatsapp-link[data-v-a2193eb6]:hover { opacity: 0.75; } .orden-loading-dot[data-v-a2193eb6] { width: 12px; height: 12px; border-radius: 50%; background: #25D366; display: inline-block; -webkit-animation: orden-loading-pulse-data-v-a2193eb6 1.1s ease-in-out infinite; animation: orden-loading-pulse-data-v-a2193eb6 1.1s ease-in-out infinite; } @-webkit-keyframes orden-loading-pulse-data-v-a2193eb6 { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @keyframes orden-loading-pulse-data-v-a2193eb6 { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @media (max-width: 600px) { .orden-detail__row[data-v-a2193eb6] { grid-template-columns: 104px minmax(0, 1fr); } .orden-footer[data-v-a2193eb6] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .orden-whatsapp-link[data-v-a2193eb6] { margin-left: 0; } } .page-header[data-v-098bef20] { margin-bottom: 24px; } .page-title[data-v-098bef20] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-098bef20] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .loading-message-card[data-v-098bef20] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-098bef20] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-098bef20 1.6s ease-in-out infinite; animation: loading-bar-data-v-098bef20 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-098bef20 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-098bef20 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-098bef20] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-098bef20] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-098bef20] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-098bef20] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-098bef20] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-098bef20] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-098bef20] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-098bef20] { padding: 16px 12px 80px; } .v-btn[data-v-098bef20] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .informe-card[data-v-4ec05cae] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; } .card-strip[data-v-4ec05cae] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-4ec05cae] { font-weight: 600; color: var(--color-text-secondary); } .informe-detail[data-v-4ec05cae] { padding: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .informe-detail__row[data-v-4ec05cae] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .informe-detail__key[data-v-4ec05cae] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .informe-detail__val[data-v-4ec05cae] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } /* ── Footer: botones + WhatsApp ── */ .informe-footer[data-v-4ec05cae] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .informe-actions[data-v-4ec05cae] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .informe-action-btn[data-v-4ec05cae] { text-transform: none; letter-spacing: 0; } .informe-whatsapp-link[data-v-4ec05cae] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #25D366; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .informe-whatsapp-link[data-v-4ec05cae]:hover { opacity: 0.75; } .informe-loading-dot[data-v-4ec05cae] { width: 12px; height: 12px; border-radius: 50%; background: #25D366; display: inline-block; -webkit-animation: informe-loading-pulse-data-v-4ec05cae 1.1s ease-in-out infinite; animation: informe-loading-pulse-data-v-4ec05cae 1.1s ease-in-out infinite; } @-webkit-keyframes informe-loading-pulse-data-v-4ec05cae { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @keyframes informe-loading-pulse-data-v-4ec05cae { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @media (max-width: 600px) { .informe-detail__row[data-v-4ec05cae] { grid-template-columns: 104px minmax(0, 1fr); } .informe-footer[data-v-4ec05cae] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .informe-whatsapp-link[data-v-4ec05cae] { margin-left: 0; } } .page-header[data-v-0b106e2b] { margin-bottom: 24px; } .page-title[data-v-0b106e2b] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-0b106e2b] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .loading-message-card[data-v-0b106e2b] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-0b106e2b] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-0b106e2b 1.6s ease-in-out infinite; animation: loading-bar-data-v-0b106e2b 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-0b106e2b { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-0b106e2b { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-0b106e2b] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-0b106e2b] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-0b106e2b] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-0b106e2b] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-0b106e2b] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-0b106e2b] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-0b106e2b] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-0b106e2b] { padding: 16px 12px 80px; } .load-more-btn.v-btn--outlined[data-v-0b106e2b]::before { border-width: 3px !important; } .v-btn[data-v-0b106e2b] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .imagen-card[data-v-6b870f46] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; text-align: left; } .card-strip[data-v-6b870f46] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-6b870f46] { font-weight: 600; color: var(--color-text-secondary); } .imagen-detail[data-v-6b870f46] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; text-align: left; padding: 0 20px; } .imagen-detail__row[data-v-6b870f46] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .imagen-detail__key[data-v-6b870f46] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .imagen-detail__val[data-v-6b870f46] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; width: 100%; } .imagen-footer[data-v-6b870f46] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .imagen-actions[data-v-6b870f46] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .imagen-action-btn[data-v-6b870f46] { text-transform: none; letter-spacing: 0; } .imagen-whatsapp-link[data-v-6b870f46] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #25D366; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .imagen-whatsapp-link[data-v-6b870f46]:hover { opacity: 0.75; } .imagen-loading-dot[data-v-6b870f46] { width: 12px; height: 12px; border-radius: 50%; background: #25D366; display: inline-block; -webkit-animation: imagen-loading-pulse-data-v-6b870f46 1.1s ease-in-out infinite; animation: imagen-loading-pulse-data-v-6b870f46 1.1s ease-in-out infinite; } @-webkit-keyframes imagen-loading-pulse-data-v-6b870f46 { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @keyframes imagen-loading-pulse-data-v-6b870f46 { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @media (max-width: 600px) { .imagen-detail__row[data-v-6b870f46] { grid-template-columns: 104px minmax(0, 1fr); } .imagen-footer[data-v-6b870f46] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .imagen-whatsapp-link[data-v-6b870f46] { margin-left: 0; } } .page-header[data-v-7ca4a8f0] { margin-bottom: 24px; } .page-title[data-v-7ca4a8f0] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-7ca4a8f0] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .loading-message-card[data-v-7ca4a8f0] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-7ca4a8f0] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-7ca4a8f0 1.6s ease-in-out infinite; animation: loading-bar-data-v-7ca4a8f0 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-7ca4a8f0 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-7ca4a8f0 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-7ca4a8f0] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-7ca4a8f0] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-7ca4a8f0] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-7ca4a8f0] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-7ca4a8f0] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-7ca4a8f0] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-7ca4a8f0] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-7ca4a8f0] { padding: 16px 12px 80px; } .v-btn[data-v-7ca4a8f0] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .text-muted[data-v-7ca4a8f0] { font-size: 0.875rem; color: #95a5a6; margin: 0; } /* ── Page layout ── */ .page-container[data-v-73ba3514] { padding: 16px 32px 80px; } @media (max-width: 960px) { .page-container[data-v-73ba3514] { padding: 16px 16px 80px; } } /* ── Loading ── */ .confirmacion-loading[data-v-73ba3514] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 80px 0; } .confirmacion-loading-card[data-v-73ba3514] { width: 100%; max-width: 560px; padding: 24px; } .confirmacion-loading-card__line[data-v-73ba3514] { height: 12px; border-radius: 6px; background: -webkit-gradient(linear, left top, right top, from(#eef2f6), color-stop(50%, #e2e8ee), to(#eef2f6)); background: linear-gradient(90deg, #eef2f6 0%, #e2e8ee 50%, #eef2f6 100%); background-size: 200% 100%; -webkit-animation: confirmacion-skeleton-shimmer-data-v-73ba3514 1.4s ease-in-out infinite; animation: confirmacion-skeleton-shimmer-data-v-73ba3514 1.4s ease-in-out infinite; margin-bottom: 12px; } .confirmacion-loading-card__line--md[data-v-73ba3514] { width: 74%; } .confirmacion-loading-card__line--sm[data-v-73ba3514] { width: 56%; margin-bottom: 0; } @-webkit-keyframes confirmacion-skeleton-shimmer-data-v-73ba3514 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes confirmacion-skeleton-shimmer-data-v-73ba3514 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } /* ── Wrapper centrado ── */ .confirmacion-wrap[data-v-73ba3514] { max-width: 600px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; } /* ── Ícono de éxito ── */ .confirmacion-icon[data-v-73ba3514] { margin-bottom: 24px; } .confirmacion-icon__circle[data-v-73ba3514] { width: 80px; height: 80px; border-radius: 50%; background-color: #1282a2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-shadow: 0 4px 20px rgba(18, 130, 162, 0.3); box-shadow: 0 4px 20px rgba(18, 130, 162, 0.3); } /* ── Título y subtítulo ── */ .confirmacion-title[data-v-73ba3514] { font-size: 1.6rem; font-weight: 700; color: #2c3e50; line-height: 1.2; margin: 0 0 8px; } .confirmacion-subtitle[data-v-73ba3514] { font-size: 0.95rem; color: #95a5a6; margin: 0 0 32px; } /* ── Card resumen ── */ .confirmacion-card[data-v-73ba3514] { width: 100%; padding: 24px; text-align: left; margin-bottom: 24px; } .confirmacion-card__label[data-v-73ba3514] { font-size: 0.7rem; font-weight: 700; color: #95a5a6; text-transform: uppercase; letter-spacing: 1px; margin-bottom: 12px; } .confirmacion-detail[data-v-73ba3514] { width: 100%; margin-bottom: 16px; } .confirmacion-detail__row[data-v-73ba3514] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; gap: 6px; padding: 6px 0; border-bottom: 1px solid #f0f2f5; } .confirmacion-detail__row[data-v-73ba3514]:last-child { border-bottom: none; } .confirmacion-detail__key[data-v-73ba3514] { font-size: 0.78rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; -ms-flex-negative: 0; flex-shrink: 0; } .confirmacion-detail__val[data-v-73ba3514] { font-size: 0.95rem; color: #2c3e50; font-weight: 400; } .confirmacion-detail__val--estado[data-v-73ba3514] { color: #27ae60; font-weight: 600; } .confirmacion-calendar[data-v-73ba3514] { margin-bottom: 8px; } .confirmacion-calendar__link[data-v-73ba3514] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.85rem; color: #1282a2; text-decoration: none; gap: 4px; } .confirmacion-calendar__link[data-v-73ba3514]:hover { text-decoration: underline; } /* ── Datos de pago ── */ .confirmacion-pago[data-v-73ba3514] { width: 100%; text-align: left; margin-bottom: 24px; padding: 16px 20px; background: #f0f2f5; border-radius: 8px; } .confirmacion-pago__title[data-v-73ba3514] { font-size: 0.9rem; font-weight: 600; color: #2c3e50; margin: 0 0 10px; } .confirmacion-pago__item[data-v-73ba3514] { font-size: 0.85rem; color: #5f6b7a; padding: 3px 0; } /* ── Botones ── */ .confirmacion-actions[data-v-73ba3514] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 12px; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 600px) { .page-container[data-v-73ba3514] { padding: 54px 16px 72px; } .confirmacion-wrap[data-v-73ba3514] { max-width: 100%; } .confirmacion-icon[data-v-73ba3514] { margin-bottom: 18px; } .confirmacion-icon__circle[data-v-73ba3514] { width: 72px; height: 72px; } .confirmacion-title[data-v-73ba3514] { font-size: 1.45rem; } .confirmacion-subtitle[data-v-73ba3514] { font-size: 0.9rem; margin: 0 0 24px; } .confirmacion-card[data-v-73ba3514] { padding: 20px; margin-bottom: 20px; } .confirmacion-detail__key[data-v-73ba3514] { font-size: 0.74rem; } .confirmacion-detail__val[data-v-73ba3514] { font-size: 0.9rem; } .confirmacion-calendar__link[data-v-73ba3514] { font-size: 0.82rem; } .confirmacion-actions[data-v-73ba3514] { width: 100%; gap: 10px; } } .phone-input-group[data-v-18514f04] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; border: 1px solid rgba(0, 0, 0, 0.38); border-radius: 4px; overflow: hidden; background: #fff; min-height: 56px; -webkit-transition: border-color 0.2s; transition: border-color 0.2s; } .phone-input-group[data-v-18514f04]:focus-within { border-color: #1976d2; } .group-field[data-v-18514f04] { border: none; border-radius: 0; outline: none; -webkit-box-shadow: none; box-shadow: none; background: transparent; padding: 10px 14px; font-size: 14px; color: #0f172a; min-height: 56px; } .group-field[data-v-18514f04]::-webkit-input-placeholder { color: #94a3b8; } .group-field[data-v-18514f04]::-moz-placeholder { color: #94a3b8; } .group-field[data-v-18514f04]:-ms-input-placeholder { color: #94a3b8; } .group-field[data-v-18514f04]::-ms-input-placeholder { color: #94a3b8; } .group-field[data-v-18514f04]::placeholder { color: #94a3b8; } .group-country[data-v-18514f04] { width: auto; max-width: 140px; border-right: 1px solid rgba(0, 0, 0, 0.12); appearance: none; -webkit-appearance: none; -moz-appearance: none; background-image: linear-gradient(45deg, transparent 50%, #64748b 50%), linear-gradient(135deg, #64748b 50%, transparent 50%); background-position: calc(100% - 16px) 50%, calc(100% - 11px) 50%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 28px; } /* Country select — overlay pattern */ .country-select-wrapper[data-v-18514f04] { position: relative; -webkit-box-flex: 0; -ms-flex: 0 0 80px; flex: 0 0 80px; border-right: 1px solid rgba(0, 0, 0, 0.12); min-height: 56px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .country-select-display[data-v-18514f04] { position: absolute; inset: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 0 10px; font-size: 14px; color: #0f172a; pointer-events: none; background: transparent; white-space: nowrap; font-weight: 500; } .country-select-native[data-v-18514f04] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; border: none; outline: none; } .group-area[data-v-18514f04] { -webkit-box-flex: 0; -ms-flex: 0 0 100px; flex: 0 0 100px; max-width: 100px; border-right: 1px solid rgba(0, 0, 0, 0.12); } .group-number[data-v-18514f04] { -webkit-box-flex: 1; -ms-flex: 1 1 auto; flex: 1 1 auto; min-width: 0; } .phone-group-error[data-v-18514f04] { color: #ff5252; font-size: 12px; line-height: 1; min-height: 14px; margin-top: 6px; margin-left: 12px; } /* Layout */ .page-container[data-v-7aa36508] { padding: var(--space-4) var(--space-8) 80px; } .page-header[data-v-7aa36508] { margin-bottom: var(--space-6); } .page-title[data-v-7aa36508] { font-family: var(--font-family-base); font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); line-height: var(--line-height-tight); margin: 0 0 4px 0; } .page-subtitle[data-v-7aa36508] { font-size: var(--font-size-small); color: var(--color-text-muted); margin: 0; } @media (max-width: 960px) { .page-container[data-v-7aa36508] { padding: var(--space-4) var(--space-4) 80px; } .page-header[data-v-7aa36508] { padding-top: 56px; } } /* Section cards */ .perfil-card[data-v-7aa36508] { padding: var(--space-5) var(--space-6); margin-bottom: var(--space-4); } /* Loading message card */ .loading-message-card[data-v-7aa36508] { background: #eef6fb; border-radius: var(--radius-lg); padding: var(--space-4) 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: var(--space-4); } .loading-message-card__bar[data-v-7aa36508] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(var(--color-primary)), color-stop(50%, #a8d8ea), to(var(--color-primary))); background: linear-gradient(90deg, var(--color-primary) 0%, #a8d8ea 50%, var(--color-primary) 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-7aa36508 1.6s ease-in-out infinite; animation: loading-bar-data-v-7aa36508 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-7aa36508 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-7aa36508 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-7aa36508] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-7aa36508] { font-size: 0.95rem; font-weight: var(--font-weight-semibold); color: var(--color-primary); } .loading-message-card__sub[data-v-7aa36508] { font-size: 0.82rem; color: #5a9ab5; } /* Section title */ .perfil-section-title[data-v-7aa36508] { font-family: var(--font-family-base); font-size: var(--font-size-body); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); margin: 0 0 var(--space-4) 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } /* Phone label */ .perfil-phone-label[data-v-7aa36508] { font-size: var(--font-size-caption); color: var(--color-text-secondary); margin-bottom: 4px; } /* Save actions */ .perfil-actions[data-v-7aa36508] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; margin-top: var(--space-4); } /* Account list */ .perfil-cuenta-empty[data-v-7aa36508] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: var(--color-text-muted); font-size: var(--font-size-small); padding: var(--space-2) 0 var(--space-3); } .perfil-cuenta-row[data-v-7aa36508] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 10px 0; border-bottom: 1px solid var(--color-surface-page); } .perfil-cuenta-row[data-v-7aa36508]:last-of-type { border-bottom: none; } .perfil-cuenta-row--eliminado .perfil-cuenta-email[data-v-7aa36508] { text-decoration: line-through; color: var(--color-error); } .perfil-cuenta-email[data-v-7aa36508] { font-size: 0.9rem; color: var(--color-text-primary); } .card-style { margin: 2rem 0; width: 60%; } .aviso-card { background-color: #ffffff; border: 1px solid rgba(0,0,0,0.08); width: min(780px, calc(100% - 20px)); margin: 0 auto; } .registro-no-disponible-flex, .correo-no-asociado-flex { max-width: 780px; } .generic-message-layout { margin: 0; } .generic-message-flex { max-width: 780px; } .generic-message-card { width: 100%; text-align: left; } .generic-message-title { margin-bottom: 16px; } .generic-message-body { margin-bottom: 18px; } .generic-message-text { margin-bottom: 10px; } .generic-message-button { margin-top: 4px; } .generic-error-root.registro-no-disponible-root { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .generic-error-root:not(.registro-no-disponible-root) { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .registro-no-disponible-layout, .correo-no-asociado-layout { margin: 0; } @media screen and (min-width: 961px) { .generic-error-root:not(.registro-no-disponible-root) { margin-top: 0 !important; padding-top: 28vh; padding-bottom: 24px; } .generic-error-root.registro-no-disponible-root { --registro-top-space: 28vh; margin-top: 0 !important; padding-top: var(--registro-top-space); padding-bottom: 24px; } .registro-no-disponible-layout, .correo-no-asociado-layout { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card { max-height: calc(100vh - var(--registro-top-space) - 28px); overflow-y: auto; } .aviso-actions { margin-top: 0; } } @media screen and (max-width: 960px) { .generic-error-root:not(.registro-no-disponible-root) { margin-top: 0 !important; padding-top: 14vh; } .generic-error-root.registro-no-disponible-root { --registro-top-space: 14vh; margin-top: 0 !important; padding-top: var(--registro-top-space); padding-bottom: 20px; } .registro-no-disponible-layout, .correo-no-asociado-layout { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card { width: calc(100vw - 18px); max-height: calc(100vh - var(--registro-top-space) - 24px); overflow-y: auto; border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } } /* Mobile alto (ej: 390x844): mas ancho, un poco mas abajo y con mejor separacion del boton */ @media screen and (min-width: 360px) and (max-width: 430px) and (min-height: 760px) { .generic-error-root.registro-no-disponible-root { --registro-top-space: clamp(28px, 5.2vh, 46px); } .aviso-card { width: calc(100vw - 10px); max-height: none; overflow: visible; padding-left: 18px !important; padding-right: 18px !important; } .aviso-text, .contact-item { font-size: 1.3rem; } .aviso-actions { margin-top: 0; } } .aviso-title { font-family: 'Roboto', sans-serif; color: #2c3e50; font-weight: 700; font-size: 2.2rem; margin: 0; } .aviso-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 12px; } .aviso-title-icon { -webkit-box-flex: 0; -ms-flex: 0 0 auto; flex: 0 0 auto; } .aviso-text { font-family: 'Roboto', sans-serif; color: #2c3e50; font-size: 1.55rem; font-weight: 600; line-height: 1.3; margin-bottom: 12px; text-align: left; } .aviso-text-regular { font-weight: 400; } .contact-actions { margin-top: 14px; margin-bottom: 0; } .contact-btn { font-family: 'Roboto', sans-serif; min-height: 54px !important; border-radius: 12px !important; text-transform: none !important; letter-spacing: 0; font-size: 1.08rem !important; font-weight: 700; margin-bottom: 12px; } .whatsapp-btn { background-color: #1f8f46 !important; color: #ffffff !important; } .phone-btn { background-color: #1e5cb3 !important; color: #ffffff !important; } .contact-item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; margin: 10px 0; color: #2c3e50; } .contact-number { font-family: 'Roboto', sans-serif; margin: 4px 0 0; text-align: center; font-size: 1.02rem; color: #1f3b66; font-weight: 700; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; gap: 6px; } .contact-number-icon { margin-top: -1px; } .back-helper-text { font-family: 'Roboto', sans-serif; display: block; font-size: 0.95rem; color: #5f6b7a; } @media screen and (min-width: 961px) and (max-height: 860px) { .aviso-card { padding: 20px 24px !important; } .aviso-title { font-size: 2.2rem; } .aviso-text { font-size: 1.45rem; line-height: 1.35; margin-bottom: 8px; } .contact-item { font-size: 1.35rem; margin: 6px 0; gap: 8px; } } @media screen and (min-width: 961px) and (max-height: 740px) { .aviso-card { padding: 16px 20px !important; } .aviso-title { font-size: 1.75rem; } .aviso-text { font-size: 1.3rem; line-height: 1.28; margin-bottom: 6px; } .contact-item { font-size: 1.2rem; margin: 4px 0; } .contact-item .v-icon, .whatsapp-icon { width: 22px; height: 22px; font-size: 22px !important; } } /* Modo compacto para desktop bajo (ej: 1208x580): evita scroll y acomoda el contenido */ @media screen and (min-width: 961px) and (max-height: 620px) { .generic-error-root.registro-no-disponible-root { --registro-top-space: clamp(150px, 27vh, 190px); padding-bottom: 10px; } .aviso-card { width: min(760px, calc(100% - 16px)); max-height: none; overflow: visible; padding: 12px 16px !important; } .aviso-card .mb-4 { margin-bottom: 8px !important; } .aviso-title { font-size: 1.3rem; line-height: 1.15; } .aviso-text { font-size: 1.15rem; line-height: 1.22; margin-bottom: 4px; } .contact-item { font-size: 1rem; margin: 3px 0; gap: 7px; } .contact-item .v-icon, .whatsapp-icon { width: 20px; height: 20px; font-size: 20px !important; } .aviso-actions { margin-top: 0 !important; } .aviso-actions .v-btn { min-height: 38px !important; } } /* Desktop bajo intermedio (ej: 964x623): compacta la tarjeta para evitar scroll interno */ @media screen and (min-width: 961px) and (max-height: 680px) { .generic-error-root.registro-no-disponible-root { --registro-top-space: 24vh; padding-bottom: 10px; } .generic-error-root:not(.registro-no-disponible-root) { padding-bottom: 10px; } .aviso-card { padding: 12px 16px !important; } .aviso-card .mb-4 { margin-bottom: 8px !important; } .generic-message-title, .aviso-title { font-size: 1.35rem; line-height: 1.15; } .generic-message-body { margin-bottom: 10px; } .generic-message-text, .aviso-text { font-size: 1.06rem; line-height: 1.22; margin-bottom: 5px; } .contact-actions { margin-top: 8px; } .contact-btn { min-height: 38px !important; font-size: 0.95rem !important; margin-bottom: 8px; } .contact-number { font-size: 0.92rem; margin-top: 2px; } .generic-message-button, .aviso-actions .v-btn { min-height: 36px !important; font-size: 0.92rem !important; margin-top: 0 !important; } } /* Altura extrema desktop (ej: 1200x400): bajar mas el bloque y compactar al maximo */ @media screen and (min-width: 961px) and (max-height: 430px) { .generic-error-root.registro-no-disponible-root { --registro-top-space: 128px; padding-bottom: 6px; } .aviso-card { width: min(760px, calc(100% - 12px)); padding: 8px 12px !important; } .aviso-card .mb-4 { margin-bottom: 4px !important; } .aviso-title { font-size: 1.05rem; line-height: 1.1; } .aviso-text { font-size: 1.1rem; line-height: 1.14; margin-bottom: 3px; } .contact-item { font-size: 1rem; margin: 2px 0; gap: 6px; } .contact-item .v-icon, .whatsapp-icon { width: 18px; height: 18px; font-size: 18px !important; } .aviso-actions { margin-top: 0 !important; } .aviso-actions .v-btn { min-height: 34px !important; font-size: 1rem; } } .phone { color: #4285f4; } .whatsapp-icon { width: 28px; height: 28px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-right: 14px; } @media screen and (max-width: 960px) { .margenMobile { margin-top: 0 !important; margin-bottom: 2vh; } .generic-message-card, .registro-no-disponible-root .aviso-card { border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .aviso-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; gap: 10px; } .aviso-title-icon { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; margin: 0; } .aviso-title { font-size: 1.7rem; line-height: 1.2; letter-spacing: 0.01em; text-wrap: balance; width: 100%; text-align: center; } .aviso-text { font-size: 1.18rem; line-height: 1.38; letter-spacing: 0.005em; text-wrap: pretty; } .aviso-header { -webkit-box-align: center; -ms-flex-align: center; align-items: center; } } .login-step-root[data-v-2276c8ea] { width: 100%; min-height: 100%; height: 100%; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; } .login-container[data-v-2276c8ea] { min-height: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-sizing: border-box; box-sizing: border-box; } .login-card[data-v-2276c8ea] { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.08); width: 100%; margin: 0 auto; } .login-step-col[data-v-2276c8ea] { width: 100%; max-width: 780px; } .flow-title[data-v-2276c8ea] { font-family: 'Roboto', sans-serif; text-align: left; color: #2c3e50; font-weight: 700; font-size: 2.2rem; line-height: 1.2; margin-top: 0; margin-bottom: 0.2rem; } .flow-subtitle[data-v-2276c8ea] { font-family: 'Roboto', sans-serif; text-align: left; font-size: 1rem; color: #95a5a6; margin-bottom: 1.5rem; } @media screen and (max-width: 960px) { .login-step-root[data-v-2276c8ea] { overflow-y: hidden; } .login-container[data-v-2276c8ea] { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; height: auto; padding-bottom: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste puntual para tablets en vertical (ej: 900x1440): en este viewport el logo mobile ocupa bastante alto y tapa la tarjeta. */ @media screen and (min-width: 861px) and (max-width: 960px) and (min-height: 1300px) { .login-container[data-v-2276c8ea] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 8vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste puntual para resolucion tipo 853x1280 */ @media screen and (min-width: 801px) and (max-width: 860px) and (min-height: 1180px) and (max-height: 1299px) { .login-container[data-v-2276c8ea] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 8vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste puntual para iPad portrait (768x1024) */ @media screen and (min-width: 601px) and (max-width: 800px) and (min-height: 900px) { .login-container[data-v-2276c8ea] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 14vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } @media screen and (max-width: 600px) { .login-container[data-v-2276c8ea] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 14vh !important; min-height: 100vh; overflow-y: hidden; } .login-container.transparent-logo-offset[data-v-2276c8ea] { padding-top: 5vh !important; } } @media screen and (max-width: 960px) { .login-card[data-v-2276c8ea] { border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } } /* Evita que el contenido se monte sobre el logo fijo en desktop */ @media screen and (min-width: 961px) { .login-container.transparent-logo-offset[data-v-2276c8ea] { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-top: clamp(96px, 14vh, 160px); -webkit-box-sizing: border-box; box-sizing: border-box; } .login-container.opaque-logo-offset[data-v-2276c8ea] { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-top: 28vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .login-provider-selection .flow-title[data-v-2276c8ea] { font-size: 2.2rem; line-height: 1.15; margin-bottom: clamp(8px, 1.2vh, 16px); } .login-provider-selection .flow-subtitle[data-v-2276c8ea] { font-size: 1rem; line-height: 1.35; margin-bottom: clamp(8px, 1vh, 14px); } .login-provider-selection .linea[data-v-2276c8ea] { margin-bottom: clamp(6px, 1vh, 10px); } .login-provider-selection .v-btn[data-v-2276c8ea] { min-height: clamp(40px, 5vh, 48px) !important; } .login-provider-selection .button-icon[data-v-2276c8ea] { font-size: clamp(22px, 2.4vh, 26px); } .login-provider-selection .button-text[data-v-2276c8ea] { font-size: clamp(0.95rem, 1.9vh, 1.05rem); } } /* Desktop con altura extrema (ej: 1200x400): compactar solo el formulario de seleccion */ @media screen and (min-width: 961px) and (max-height: 430px) { .login-step-root[data-v-2276c8ea] { overflow-y: hidden; } .login-container[data-v-2276c8ea] { overflow: hidden; } .login-container.transparent-logo-offset[data-v-2276c8ea] { padding-top: 72px; } .login-container.opaque-logo-offset[data-v-2276c8ea] { padding-top: 88px; } .login-card[data-v-2276c8ea] { max-height: calc(100vh - 76px); overflow: hidden; padding: 8px 12px !important; } .login-provider-selection .flow-title[data-v-2276c8ea] { font-size: 1.25rem; line-height: 1.1; margin-bottom: 2px; } .login-provider-selection .flow-subtitle[data-v-2276c8ea] { font-size: 0.86rem !important; line-height: 1.14; margin-bottom: 3px; } .login-provider-selection .linea[data-v-2276c8ea] { margin-bottom: 2px; } .login-provider-selection .v-btn[data-v-2276c8ea] { min-height: 30px !important; } .login-provider-selection .button-icon[data-v-2276c8ea] { font-size: 18px !important; } .login-provider-selection .button-text[data-v-2276c8ea] { font-size: 0.78rem !important; padding-right: 14px; } .login-provider-selection .v-divider[data-v-2276c8ea] { margin-top: 1px; margin-bottom: 1px; } } /* Ajuste puntual para resolucion tipo 980x440 */ @media screen and (min-width: 961px) and (max-width: 1020px) and (min-height: 431px) and (max-height: 460px) { .login-step-root[data-v-2276c8ea] { overflow-y: hidden; } .login-container[data-v-2276c8ea] { overflow: hidden; } .login-container.transparent-logo-offset[data-v-2276c8ea] { padding-top: 40px; } .login-container.opaque-logo-offset[data-v-2276c8ea] { padding-top: 56px; } .login-card[data-v-2276c8ea] { max-height: calc(100vh - 54px); overflow: hidden; } } .button-segmented .button-icon[data-v-2276c8ea] { vertical-align: middle; display: inline-block; width: 30%; font-size: 25px; font-family: "Roboto"; margin-left: 5px; } .button-segmented .email[data-v-2276c8ea] { color: #4285f4; margin-top: 2px; } .button-segmented .google[data-v-2276c8ea] { color: #c71610; } .button-segmented .button-text[data-v-2276c8ea] { display: inline-block; vertical-align: middle; text-align: center; width: 60%; font-weight: bold; padding-right: 40px; font-family: "Roboto"; color: black; } .linea[data-v-2276c8ea] { margin-bottom: 10px; } .provider-separator[data-v-2276c8ea] { margin: 0; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 12px; } .provider-separator-line[data-v-2276c8ea] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; } .provider-separator-text[data-v-2276c8ea] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-width: 18px; color: #5f6b7a; font-weight: 600; line-height: 1; } .noPaddingBot[data-v-2276c8ea] { padding-bottom: 0 !important; } .google-loading-placeholder[data-v-2276c8ea] { width: 100%; max-width: 320px; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; } .google-loading-placeholder__bar[data-v-2276c8ea] { height: 18px; border-radius: 999px; background: -webkit-gradient(linear, left top, right top, from(#eceff1), color-stop(50%, #dfe3e6), to(#eceff1)); background: linear-gradient(90deg, #eceff1 0%, #dfe3e6 50%, #eceff1 100%); background-size: 200% 100%; -webkit-animation: login-skeleton-shimmer-data-v-2276c8ea 1.4s ease-in-out infinite; animation: login-skeleton-shimmer-data-v-2276c8ea 1.4s ease-in-out infinite; } .google-loading-placeholder__bar--top[data-v-2276c8ea] { width: 190px; } .google-loading-placeholder__bar--bottom[data-v-2276c8ea] { width: 280px; } @-webkit-keyframes login-skeleton-shimmer-data-v-2276c8ea { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes login-skeleton-shimmer-data-v-2276c8ea { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .wrapper[data-v-2276c8ea] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; height: 200px } .ball[data-v-2276c8ea] { width: 22px; height: 22px; border-radius: 11px; margin: 0 10px; -webkit-animation: 2s bounce-data-v-2276c8ea ease infinite; animation: 2s bounce-data-v-2276c8ea ease infinite; } .blue[data-v-2276c8ea] { background-color: #4285F5; } .red[data-v-2276c8ea] { background-color: #EA4436; -webkit-animation-delay: .25s; animation-delay: .25s; } .yellow[data-v-2276c8ea] { background-color: #FBBD06; -webkit-animation-delay: .5s; animation-delay: .5s; } .green[data-v-2276c8ea] { background-color: #34A952; -webkit-animation-delay: .75s; animation-delay: .75s; } @-webkit-keyframes bounce-data-v-2276c8ea { 50% { -webkit-transform: translateY(25px); transform: translateY(25px); } } @keyframes bounce-data-v-2276c8ea { 50% { -webkit-transform: translateY(25px); transform: translateY(25px); } } @media screen and (max-width: 600px) { .flow-title[data-v-2276c8ea], .flow-subtitle[data-v-2276c8ea] { text-align: center !important; } .izquierda[data-v-2276c8ea] { text-align: left !important; } } /* Contenedor principal que ocupa toda la pantalla */ .main-container[data-v-5116ba29] { min-height: 100vh; /* Altura minima de la ventana */ height: 100%; width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; /* Activar Flexbox */ -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; /* Alinear en columna */ -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; /* CENTRADO VERTICAL (Magia) */ -webkit-box-align: center; -ms-flex-align: center; align-items: center; /* Centrado Horizontal del bloque */ overflow-x: hidden; overflow-y: auto; /* Permitir scroll del formulario en pantallas chicas */ -webkit-overflow-scrolling: touch; background-color: white; /* Asegurar fondo */ } /* El wrapper del contenido interno */ .login-content[data-v-5116ba29] { width: 100%; /* Para que el sistema de columnas de Vuetify funcione bien */ max-width: 100%; padding-bottom: 1rem; -webkit-box-sizing: border-box; box-sizing: border-box; } .login-card[data-v-5116ba29] { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.08); } .flow-title[data-v-5116ba29] { font-family: 'Roboto', sans-serif; text-align: left; color: #2c3e50; font-weight: 700; font-size: 2.2rem; line-height: 1.2; margin-bottom: 0.2rem; } .flow-subtitle[data-v-5116ba29] { font-family: 'Roboto', sans-serif; text-align: left; font-size: 1rem; color: #2c3e50; margin-bottom: 1.5rem; } .install-hint[data-v-5116ba29] { color: #7f8c8d; line-height: 1.35; } @media screen and (min-width: 961px) { .main-container.transparent-login-shift[data-v-5116ba29] { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-top: clamp(96px, 14vh, 160px); -webkit-box-sizing: border-box; box-sizing: border-box; } .main-container.opaque-login-shift[data-v-5116ba29] { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-top: 28vh; -webkit-box-sizing: border-box; box-sizing: border-box; } } @media screen and (min-width: 961px) and (max-height: 430px) { .main-container[data-v-5116ba29] { overflow-y: hidden; } .main-container.transparent-login-shift[data-v-5116ba29] { padding-top: 72px; } .main-container.opaque-login-shift[data-v-5116ba29] { padding-top: 88px; } .login-card[data-v-5116ba29] { max-height: calc(100vh - 76px); overflow: hidden; padding: 8px 12px !important; } .flow-title[data-v-5116ba29] { font-size: 1.25rem; line-height: 1.1; margin-bottom: 2px; } .flow-subtitle[data-v-5116ba29] { font-size: 0.86rem !important; line-height: 1.14; margin-bottom: 4px; } .input-lg[data-v-5116ba29] .v-input__control { min-height: 38px; } .input-lg[data-v-5116ba29] input, .input-lg[data-v-5116ba29] .v-select__selection { font-size: 0.9rem !important; } .input-lg[data-v-5116ba29] .v-label { font-size: 0.86rem !important; } .v-btn[data-v-5116ba29] { height: 32px !important; } } /* Ajuste puntual para resolucion tipo 980x440 */ @media screen and (min-width: 961px) and (max-width: 1020px) and (min-height: 431px) and (max-height: 460px) { .main-container[data-v-5116ba29] { overflow-y: hidden; } .main-container.transparent-login-shift[data-v-5116ba29] { padding-top: 40px; } .main-container.opaque-login-shift[data-v-5116ba29] { padding-top: 56px; } .login-card[data-v-5116ba29] { max-height: calc(100vh - 54px); overflow: hidden; } } .noPaddingBot[data-v-5116ba29] { padding-bottom: 0 !important; } .input-lg[data-v-5116ba29] .v-input__control { min-height: 56px; } .input-lg[data-v-5116ba29] input, .input-lg[data-v-5116ba29] .v-select__selection { font-size: 1.1rem !important; color: #333 !important; } .input-lg[data-v-5116ba29] .v-label { font-size: 1.1rem !important; } .input-lg[data-v-5116ba29] .v-input__slot fieldset { background-color: transparent !important; } .input-lg.v-text-field--outlined[data-v-5116ba29] .v-input__slot { background-color: white !important; } /* AJUSTES RESPONSIVE */ @media screen and (max-width: 600px) { /* En celulares, centramos el texto */ .flow-title[data-v-5116ba29], .flow-subtitle[data-v-5116ba29] { text-align: center !important; } } @media screen and (max-width: 600px) { .main-container[data-v-5116ba29] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 14vh !important; min-height: 100vh; overflow-y: hidden; } .main-container.transparent-login-shift[data-v-5116ba29] { padding-top: 5vh !important; } .btn-closer-opaque[data-v-5116ba29] { margin-top: -10px; } .btn-closer-transparent[data-v-5116ba29] { margin-top: -18px; } .flow-title[data-v-5116ba29] { text-align: center !important; font-size: 1.8rem !important; margin-top: 0 !important; } .flow-subtitle[data-v-5116ba29] { text-align: center !important; margin-bottom: 1.5rem !important; } } @media screen and (max-width: 960px) { .login-card[data-v-5116ba29] { border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } } /* Ajuste puntual para tablets en vertical (ej: 900x1440): en este viewport el centrado vertical deja la tarjeta demasiado abajo. */ @media screen and (min-width: 861px) and (max-width: 960px) and (min-height: 1300px) { .main-container[data-v-5116ba29] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 8vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste puntual para resolucion tipo 853x1280 */ @media screen and (min-width: 801px) and (max-width: 860px) and (min-height: 1180px) and (max-height: 1299px) { .main-container[data-v-5116ba29] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 8vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste puntual para iPad portrait (768x1024) */ @media screen and (min-width: 601px) and (max-width: 800px) and (min-height: 900px) { .main-container[data-v-5116ba29] { -webkit-box-pack: start !important; -ms-flex-pack: start !important; justify-content: flex-start !important; padding-top: 14vh !important; -webkit-box-sizing: border-box; box-sizing: border-box; } } /* Ajuste para pantallas con poca altura (Laptops pequeñas / Celulares apaisados) */ @media screen and (max-height: 700px) { .flow-title[data-v-5116ba29] { font-size: 1.8rem; margin-bottom: 0.5rem; } .flow-subtitle[data-v-5116ba29] { margin-bottom: 0.5rem; } .v-btn[data-v-5116ba29] { height: 40px !important; /* Botón más chico */ } } .envio-root[data-v-a6accfec] { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .envio-mail-layout[data-v-a6accfec] { margin: 0; } .envio-mail-col[data-v-a6accfec] { max-width: 780px; } .envio-mail-card[data-v-a6accfec] { width: 100%; } .envio-mail-text[data-v-a6accfec] { text-align: left; color: #2c3e50; font-size: 1rem; line-height: 1.55; margin-bottom: 10px; } .envio-mail-text-secondary[data-v-a6accfec] { margin-bottom: 16px; } .envio-mail-link-wrap[data-v-a6accfec] { margin-top: 6px; } .envio-mail-extra[data-v-a6accfec] { margin-top: 18px; } .envio-mail-footnote[data-v-a6accfec] { text-align: center; font-size: 14px; color: #5f6b7a; line-height: 1.5; margin: 14px 0 0; } .envio-root.no-email-root[data-v-a6accfec] { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .registro-no-mail-layout[data-v-a6accfec] { margin: 0; } .registro-no-mail-col[data-v-a6accfec] { max-width: 780px; } @media screen and (min-width: 961px) { .envio-root.email-sent-root[data-v-a6accfec] { --envio-top-space: 28vh; margin-top: 0 !important; padding-top: var(--envio-top-space); padding-bottom: 24px; } .envio-mail-layout[data-v-a6accfec] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: 28vh; margin-top: 0 !important; padding-top: var(--envio-top-space); padding-bottom: 24px; } .registro-no-mail-layout[data-v-a6accfec] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-a6accfec] { max-height: calc(100vh - var(--envio-top-space) - 28px); overflow-y: auto; } } @media screen and (max-width: 960px) { .envio-root.email-sent-root[data-v-a6accfec] { --envio-top-space: 14vh; margin-top: 0 !important; padding-top: var(--envio-top-space); padding-bottom: 20px; } .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: 14vh; margin-top: 0 !important; padding-top: var(--envio-top-space); padding-bottom: 20px; } .registro-no-mail-layout[data-v-a6accfec] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-a6accfec] { width: calc(100vw - 18px); max-height: calc(100vh - var(--envio-top-space) - 24px); overflow-y: auto; border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } } @media screen and (min-width: 360px) and (max-width: 430px) and (min-height: 760px) { .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: clamp(28px, 5.2vh, 46px); } .envio-root.no-email-root .aviso-card[data-v-a6accfec] { width: calc(100vw - 10px); max-height: none; overflow: visible; padding-left: 18px !important; padding-right: 18px !important; } .envio-root.no-email-root .aviso-text[data-v-a6accfec] { font-size: 1.3rem; } } .aviso-card[data-v-a6accfec] { background-color: #ffffff; border: 1px solid rgba(0, 0, 0, 0.08); width: min(780px, calc(100% - 20px)); margin: 0 auto; } .aviso-header[data-v-a6accfec] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 12px; } .aviso-title[data-v-a6accfec] { font-family: 'Roboto', sans-serif; color: #2c3e50; font-weight: 700; font-size: 2.2rem; margin: 0; } .aviso-text[data-v-a6accfec] { font-family: 'Roboto', sans-serif; color: #2c3e50; font-size: 1.55rem; font-weight: 600; line-height: 1.3; margin-bottom: 12px; text-align: center; } .aviso-text-regular[data-v-a6accfec] { font-weight: 400; } .contact-actions[data-v-a6accfec] { margin-top: 14px; margin-bottom: 0; } .contact-btn[data-v-a6accfec] { font-family: 'Roboto', sans-serif; min-height: 54px !important; border-radius: 12px !important; text-transform: none !important; letter-spacing: 0; font-size: 1.08rem !important; font-weight: 700; margin-bottom: 12px; } .whatsapp-btn[data-v-a6accfec] { background-color: #1f8f46 !important; color: #ffffff !important; } .phone-btn[data-v-a6accfec] { background-color: #1e5cb3 !important; color: #ffffff !important; } .contact-number[data-v-a6accfec] { font-family: 'Roboto', sans-serif; margin: 4px 0 0; text-align: center; font-size: 1.02rem; color: #1f3b66; font-weight: 700; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; gap: 6px; } .contact-number-icon[data-v-a6accfec] { margin-top: -1px; } .aviso-actions[data-v-a6accfec] { margin-top: 0; } .back-helper-text[data-v-a6accfec] { display: block; color: #5f6368; } .whatsapp-icon[data-v-a6accfec] { width: 24px; height: 24px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-right: 14px; } @media screen and (max-width: 600px) { h1[data-v-a6accfec], p[data-v-a6accfec] { text-align: center !important; } .aviso-header[data-v-a6accfec] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .aviso-title[data-v-a6accfec] { font-size: 1.8rem; } } /* Desktop bajo intermedio (ej: 964x623): compacta para evitar scroll interno */ @media screen and (min-width: 961px) and (max-height: 680px) { .envio-root.email-sent-root[data-v-a6accfec], .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: 24vh; padding-bottom: 10px; } .aviso-card[data-v-a6accfec] { padding: 12px 16px !important; } .aviso-card .mb-4[data-v-a6accfec] { margin-bottom: 8px !important; } .aviso-title[data-v-a6accfec] { font-size: 1.35rem; line-height: 1.15; } .aviso-text[data-v-a6accfec] { font-size: 1.06rem; line-height: 1.22; margin-bottom: 6px; } .envio-mail-text-secondary[data-v-a6accfec] { margin-bottom: 10px; } .envio-mail-extra[data-v-a6accfec] { margin-top: 10px; } .envio-mail-footnote[data-v-a6accfec] { font-size: 0.9rem; line-height: 1.3; margin-top: 8px; } .contact-actions[data-v-a6accfec] { margin-top: 8px; } .contact-btn[data-v-a6accfec] { min-height: 38px !important; font-size: 0.95rem !important; margin-bottom: 8px; } .contact-number[data-v-a6accfec] { font-size: 0.92rem; margin-top: 2px; } .aviso-actions .v-btn[data-v-a6accfec] { min-height: 36px !important; font-size: 0.92rem !important; margin-top: 0 !important; } } @media screen and (min-width: 961px) and (max-height: 620px) { .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: clamp(150px, 27vh, 190px); padding-bottom: 10px; } .envio-root.no-email-root .aviso-card[data-v-a6accfec] { width: min(760px, calc(100% - 16px)); max-height: none; overflow: visible; padding: 12px 16px !important; } .envio-root.no-email-root .aviso-card .mb-4[data-v-a6accfec] { margin-bottom: 8px !important; } .envio-root.no-email-root .aviso-title[data-v-a6accfec] { font-size: 1.3rem; line-height: 1.15; } .envio-root.no-email-root .aviso-text[data-v-a6accfec] { font-size: 1.15rem; line-height: 1.22; margin-bottom: 4px; } .envio-root.no-email-root .contact-actions[data-v-a6accfec] { margin-top: 8px; } .envio-root.no-email-root .contact-btn[data-v-a6accfec] { min-height: 38px !important; font-size: 0.95rem !important; margin-bottom: 8px; } .envio-root.no-email-root .contact-number[data-v-a6accfec] { font-size: 0.92rem; margin-top: 2px; } .envio-root.no-email-root .aviso-actions .v-btn[data-v-a6accfec] { min-height: 36px !important; font-size: 0.92rem !important; margin-top: 0 !important; } } @media screen and (min-width: 961px) and (max-height: 430px) { .envio-root.no-email-root[data-v-a6accfec] { --envio-top-space: 128px; padding-bottom: 6px; } .envio-root.no-email-root .aviso-card[data-v-a6accfec] { width: min(760px, calc(100% - 12px)); padding: 8px 12px !important; } .envio-root.no-email-root .aviso-card .mb-4[data-v-a6accfec] { margin-bottom: 4px !important; } .envio-root.no-email-root .aviso-title[data-v-a6accfec] { font-size: 1.05rem; line-height: 1.1; } .envio-root.no-email-root .aviso-text[data-v-a6accfec] { font-size: 1.1rem; line-height: 1.14; margin-bottom: 3px; } .envio-root.no-email-root .aviso-actions[data-v-a6accfec] { margin-top: 0 !important; } .envio-root.no-email-root .aviso-actions .v-btn[data-v-a6accfec] { min-height: 34px !important; font-size: 1rem; } } @media screen and (max-width: 960px) { .margenMobile[data-v-a6accfec] { margin-top: 0 !important; margin-bottom: 2vh; } .aviso-header[data-v-a6accfec] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; gap: 10px; } .aviso-header .v-icon[data-v-a6accfec] { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; margin: 0; } .aviso-title[data-v-a6accfec] { font-size: 1.7rem; line-height: 1.2; letter-spacing: 0.01em; text-wrap: balance; width: 100%; text-align: center; } .aviso-text[data-v-a6accfec] { font-size: 1.18rem; line-height: 1.38; letter-spacing: 0.005em; text-wrap: pretty; } } sniper-link[data-v-a6accfec]::part(container) { width: 100%; } sniper-link[data-v-a6accfec]::part(button) { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 99px; } .btn-wpp-text[data-v-a6accfec] { color: #000000de; text-transform: none; } .noPaddingBot[data-v-a6accfec] { padding-bottom: 0 !important; } .phone[data-v-a6accfec] { color: #4285f4; } .email[data-v-a6accfec] { color: #4285f4; margin-top: -1px; } .sex-selector[data-v-3fba798f] { width: 100%; } .sex-selector__group[data-v-3fba798f] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 10px; } .sex-selector__button[data-v-3fba798f] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-flex: 1; -ms-flex: 1; flex: 1; min-height: 56px; padding: 0 14px; border: 1px solid #cbd5e1; border-radius: 12px; background: #ffffff; color: #334155; font-size: 14px; font-weight: 600; cursor: pointer; -webkit-transition: all 0.2s; transition: all 0.2s; } .sex-selector__button[data-v-3fba798f]:focus-visible { outline: 2px solid #94a3b8; outline-offset: 2px; } .sex-selector__button.is-active-m[data-v-3fba798f] { border-color: #3b82f6; background: #eff6ff; color: #1d4ed8; } .sex-selector__button.is-active-f[data-v-3fba798f] { border-color: #ec4899; background: #fdf2f8; color: #be185d; } /* =========== LAYOUT PRINCIPAL =========== */ .registro-container[data-v-e7e6ad26] { height: 100vh; height: 100svh; height: 100dvh; height: calc(var(--app-vh, 1vh) * 100); width: 100vw; overflow-y: hidden; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; background-color: #f0f2f5; position: fixed; top: 0; left: 0; z-index: 10; } /* Header */ .header-section[data-v-e7e6ad26] { -ms-flex-negative: 0; flex-shrink: 0; background-color: white; padding-bottom: 15px; z-index: 5; } .elevation-low[data-v-e7e6ad26] { -webkit-box-shadow: 0 2px 15px rgba(0,0,0,0.05); box-shadow: 0 2px 15px rgba(0,0,0,0.05); } /* Cuerpo */ .scrollable-body[data-v-e7e6ad26] { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; min-height: 0; overflow-y: auto; padding: 10px 0 16px 0; background-color: #f0f2f5; } /* Footer */ .footer-section[data-v-e7e6ad26] { -ms-flex-negative: 0; flex-shrink: 0; background-color: white; padding: 12px 0 calc(12px + env(safe-area-inset-bottom)); z-index: 5; } .elevation-reverse-low[data-v-e7e6ad26] { -webkit-box-shadow: 0 -4px 15px rgba(0,0,0,0.05); box-shadow: 0 -4px 15px rgba(0,0,0,0.05); } /* =========== TARJETA DEL FORMULARIO =========== */ .card-form-wrapper[data-v-e7e6ad26] { background-color: white !important; border: 1px solid rgba(0,0,0,0.05); } /* =========== FUENTES =========== */ .input-lg[data-v-e7e6ad26] .v-input__control { min-height: 56px; } .input-lg[data-v-e7e6ad26] input, .input-lg[data-v-e7e6ad26] .v-select__selection { font-size: 1.1rem !important; color: #333 !important; } .input-lg[data-v-e7e6ad26] .v-label { font-size: 1.1rem !important; } .input-lg[data-v-e7e6ad26] .v-input__slot fieldset { background-color: transparent !important; } .input-lg.v-text-field--outlined[data-v-e7e6ad26] .v-input__slot { background-color: white !important; } /* TITULO */ .title-main[data-v-e7e6ad26] { font-family: 'Roboto', sans-serif; font-weight: 700; font-size: 2.2rem; color: #2c3e50; margin-bottom: 0.2rem; text-align: center !important; width: 100%; display: block; } .title-step[data-v-e7e6ad26] { font-size: 1.5rem; font-weight: 500; color: #2c3e50; margin-bottom: 0; } .subtitle-step[data-v-e7e6ad26] { font-size: 1rem; color: #95a5a6; margin-bottom: 1.5rem; } .step-header[data-v-e7e6ad26] { text-align: center; margin-bottom: 25px; } /* =========== BOTONES INTERACTIVOS (SOLUCIÓN DEFINITIVA) =========== */ /* 1. Estado Base (Inactivo / Outlined) */ .gender-btn[data-v-e7e6ad26] { -webkit-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; border: 1px solid #cfd8dc !important; background-color: white !important; opacity: 1 !important; position: relative; overflow: hidden; } .gender-btn[data-v-e7e6ad26] .v-btn__content { /* Quitamos cualquier color forzado aquí para permitir herencia */ font-weight: 500; width: 100%; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } /* 2. Hover */ .gender-btn[data-v-e7e6ad26]:hover { border-color: #1976D2 !important; background-color: #f5f9ff !important; color: #1976D2 !important; -webkit-transform: translateY(-2px); transform: translateY(-2px); -webkit-box-shadow: 0 4px 8px rgba(0,0,0,0.08); box-shadow: 0 4px 8px rgba(0,0,0,0.08); z-index: 2; } /* 3. ESTADO ACTIVO (SELECCIONADO) */ /* Usamos selectores múltiples para garantizar especificidad máxima */ .gender-btn[data-v-e7e6ad26]:not(.v-btn--outlined), .v-btn-toggle .v-btn.v-btn--active[data-v-e7e6ad26] { background-color: #E3F2FD !important; /* FONDO AZUL CLARO */ border: 2px solid #1976D2 !important; /* BORDE AZUL */ font-weight: 700 !important; -webkit-transform: scale(1); transform: scale(1); z-index: 1; } /* FORZAR COLOR NEGRO EN HIJOS (TEXTO E ICONOS) */ .gender-btn[data-v-e7e6ad26]:not(.v-btn--outlined) .v-btn__content, .gender-btn[data-v-e7e6ad26]:not(.v-btn--outlined) .v-icon, .v-btn-toggle .v-btn.v-btn--active[data-v-e7e6ad26] .v-btn__content, .v-btn-toggle .v-btn.v-btn--active[data-v-e7e6ad26] .v-icon { color: #000000 !important; /* NEGRO ABSOLUTO */ fill: #000000 !important; /* Para SVGs si los hubiera */ } /* =========== BARRA DE PROGRESO =========== */ .step-progress[data-v-e7e6ad26] { width: 100%; } .step-label[data-v-e7e6ad26] { font-size: 0.8rem; font-weight: 600; color: #2c3e50; text-transform: uppercase; letter-spacing: 0.5px; } .progress-bar-container[data-v-e7e6ad26] { display: -webkit-box; display: -ms-flexbox; display: flex; gap: 6px; height: 6px; } .progress-step[data-v-e7e6ad26] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; background-color: #ecf0f1; border-radius: 4px; -webkit-transition: all 0.4s ease; transition: all 0.4s ease; } .progress-step.active[data-v-e7e6ad26] { background-color: #1976D2; -webkit-box-shadow: 0 0 5px rgba(25, 118, 210, 0.3); box-shadow: 0 0 5px rgba(25, 118, 210, 0.3); } .cuenta-creada-barra .progress-step.active[data-v-e7e6ad26] { background-color: #2E7D32 !important; -webkit-box-shadow: 0 0 5px rgba(46, 125, 50, 0.3) !important; box-shadow: 0 0 5px rgba(46, 125, 50, 0.3) !important; } /* =========== UTILS =========== */ .rounded-input[data-v-e7e6ad26] fieldset { border-radius: 8px; } .rounded-btn[data-v-e7e6ad26] { border-radius: 8px; font-size: 1rem !important; } .rounded-sm[data-v-e7e6ad26] { border-radius: 8px !important; } .error-sexo[data-v-e7e6ad26] { color: #ff5252; font-size: 12px; line-height: 1; min-height: 14px; margin-top: 6px; margin-left: 12px; } .fecha-select-row[data-v-e7e6ad26] { margin-top: 2px; } .fecha-nacimiento-select[data-v-e7e6ad26] .v-input__control, .fecha-nacimiento-select[data-v-e7e6ad26] .v-input__slot { min-height: 56px !important; } .error-fecha[data-v-e7e6ad26] { color: #ff5252; font-size: 12px; line-height: 1; min-height: 14px; margin-top: 6px; margin-left: 12px; } .birthdate-header[data-v-e7e6ad26] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; margin-top: 8px; margin-bottom: 8px; } .birthdate-header__title[data-v-e7e6ad26] { font-size: 14px; font-weight: 500; color: #475569; text-align: left; white-space: nowrap; } .birthdate-header__line[data-v-e7e6ad26] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; height: 1px; background: #e2e8f0; } .validation-icon-wrapper[data-v-e7e6ad26] { position: absolute; right: 15px; top: 15px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; pointer-events: none; z-index: 2; } sniper-link[data-v-e7e6ad26]::part(container) { width: 100%; } sniper-link[data-v-e7e6ad26]::part(button) { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 99px; -webkit-filter: none !important; filter: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; -webkit-box-shadow: none !important; box-shadow: none !important; background: none !important; } /* =========== TRANSICIONES =========== */ .slide-forward-enter-active[data-v-e7e6ad26], .slide-forward-leave-active[data-v-e7e6ad26], .slide-back-enter-active[data-v-e7e6ad26], .slide-back-leave-active[data-v-e7e6ad26] { -webkit-transition: all 0.4s ease-in-out; transition: all 0.4s ease-in-out; } .slide-forward-leave-to[data-v-e7e6ad26] { opacity: 0; -webkit-transform: translateX(-50px); transform: translateX(-50px); } .slide-forward-enter[data-v-e7e6ad26] { opacity: 0; -webkit-transform: translateX(50px); transform: translateX(50px); } .slide-back-leave-to[data-v-e7e6ad26] { opacity: 0; -webkit-transform: translateX(50px); transform: translateX(50px); } .slide-back-enter[data-v-e7e6ad26] { opacity: 0; -webkit-transform: translateX(-50px); transform: translateX(-50px); } .fade-enter-active[data-v-e7e6ad26], .fade-leave-active[data-v-e7e6ad26] { -webkit-transition: opacity 0.3s; transition: opacity 0.3s; } .fade-enter[data-v-e7e6ad26], .fade-leave-to[data-v-e7e6ad26] { opacity: 0; } /* =========== RESPONSIVE =========== */ @media screen and (max-height: 700px) { .title-main[data-v-e7e6ad26] { font-size: 1.8rem; } .header-section[data-v-e7e6ad26] { padding-bottom: 5px; } .step-header[data-v-e7e6ad26] { margin-bottom: 15px; } } @media screen and (max-width: 600px) { .margenMobile[data-v-e7e6ad26] { margin-top: 2vh !important; } .header-section[data-v-e7e6ad26] { padding-bottom: 8px; } .scrollable-body[data-v-e7e6ad26] { padding: 6px 0 8px 0; } .footer-section[data-v-e7e6ad26] { padding: 8px 0 calc(8px + env(safe-area-inset-bottom)); } .title-main[data-v-e7e6ad26] { font-size: 1.8rem; text-align: center !important; } .step-label[data-v-e7e6ad26] { text-align: center; } .d-flex.justify-space-between[data-v-e7e6ad26] { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; gap: 15px; } .card-form-wrapper[data-v-e7e6ad26] { padding: 25px 20px !important; background-color: white !important; -webkit-box-shadow: 0 3px 6px rgba(0,0,0,0.1) !important; box-shadow: 0 3px 6px rgba(0,0,0,0.1) !important; } .rounded-btn[data-v-e7e6ad26] { min-height: 42px !important; font-size: 0.95rem !important; } } @media screen and (min-width: 601px) { .step-icon[data-v-e7e6ad26] { font-size: 58px !important; } } .login-loading-root[data-v-b3926fc2] { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .login-loading-layout[data-v-b3926fc2] { margin: 0; } .login-loading-col[data-v-b3926fc2] { max-width: 780px; } .aviso-card[data-v-b3926fc2] { background-color: #ffffff; border: 1px solid rgba(0,0,0,0.08); width: min(780px, calc(100% - 20px)); margin: 0 auto; } .login-loading-card[data-v-b3926fc2] { text-align: center; } .aviso-header[data-v-b3926fc2] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; gap: 12px; } .aviso-title[data-v-b3926fc2] { font-family: 'Roboto', sans-serif; color: #2c3e50; font-weight: 700; font-size: 2.2rem; margin: 0; text-align: center; } .loading-spinner-wrap[data-v-b3926fc2] { padding: 10px 0 4px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 10px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .loading-line[data-v-b3926fc2] { width: min(360px, 92%); } .loading-line--short[data-v-b3926fc2] { width: min(220px, 72%); } @media screen and (min-width: 961px) { .login-loading-root[data-v-b3926fc2] { --login-loading-top-space: 28vh; margin-top: 0 !important; padding-top: var(--login-loading-top-space); padding-bottom: 24px; } .login-loading-layout[data-v-b3926fc2] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-b3926fc2] { max-height: calc(100vh - var(--login-loading-top-space) - 28px); overflow-y: auto; } } @media screen and (max-width: 960px) { .login-loading-root[data-v-b3926fc2] { --login-loading-top-space: 14vh; margin-top: 0 !important; padding-top: var(--login-loading-top-space); padding-bottom: 20px; } .login-loading-layout[data-v-b3926fc2] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-b3926fc2] { width: calc(100vw - 18px); max-height: calc(100vh - var(--login-loading-top-space) - 24px); overflow-y: auto; border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .aviso-title[data-v-b3926fc2] { font-size: 1.7rem; line-height: 1.2; } .loading-spinner-wrap[data-v-b3926fc2] { padding-top: 6px; } .margenMobile[data-v-b3926fc2] { margin-top: 0 !important; margin-bottom: 2vh; } } @media screen and (min-width: 961px) and (max-height: 680px) { .login-loading-root[data-v-b3926fc2] { --login-loading-top-space: 24vh; padding-bottom: 10px; } .aviso-card[data-v-b3926fc2] { padding: 12px 16px !important; } .aviso-title[data-v-b3926fc2] { font-size: 1.35rem; line-height: 1.15; } .loading-line[data-v-b3926fc2] { width: min(300px, 88%); } } @media screen and (min-width: 961px) and (max-height: 620px) { .login-loading-root[data-v-b3926fc2] { --login-loading-top-space: clamp(150px, 27vh, 190px); padding-bottom: 10px; } .aviso-card[data-v-b3926fc2] { width: min(760px, calc(100% - 16px)); max-height: none; overflow: visible; padding: 12px 16px !important; } } @media screen and (min-width: 961px) and (max-height: 430px) { .login-loading-root[data-v-b3926fc2] { --login-loading-top-space: 128px; padding-bottom: 6px; } .aviso-card[data-v-b3926fc2] { width: min(760px, calc(100% - 12px)); padding: 8px 12px !important; } .aviso-title[data-v-b3926fc2] { font-size: 1.05rem; line-height: 1.1; } .loading-line[data-v-b3926fc2] { width: min(260px, 86%); } } .login-error-root[data-v-475ccfab] { min-height: 100vh; -webkit-box-sizing: border-box; box-sizing: border-box; } .login-error-layout[data-v-475ccfab] { margin: 0; } .login-error-col[data-v-475ccfab] { max-width: 780px; } .aviso-card[data-v-475ccfab] { background-color: #ffffff; border: 1px solid rgba(0,0,0,0.08); width: min(780px, calc(100% - 20px)); margin: 0 auto; } .aviso-header[data-v-475ccfab] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; gap: 12px; } .aviso-title[data-v-475ccfab] { font-family: 'Roboto', sans-serif; color: #2c3e50; font-weight: 700; font-size: 2.2rem; margin: 0; } .aviso-text[data-v-475ccfab] { font-family: 'Roboto', sans-serif; color: #2c3e50; font-size: 1.55rem; font-weight: 600; line-height: 1.3; margin-bottom: 12px; text-align: left; } .aviso-text-regular[data-v-475ccfab] { font-weight: 400; } .aviso-actions[data-v-475ccfab] { margin-top: 0; } @media screen and (min-width: 961px) { .login-error-root[data-v-475ccfab] { --login-error-top-space: 28vh; margin-top: 0 !important; padding-top: var(--login-error-top-space); padding-bottom: 24px; } .login-error-layout[data-v-475ccfab] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-475ccfab] { max-height: calc(100vh - var(--login-error-top-space) - 28px); overflow-y: auto; } } @media screen and (max-width: 960px) { .login-error-root[data-v-475ccfab] { --login-error-top-space: 14vh; margin-top: 0 !important; padding-top: var(--login-error-top-space); padding-bottom: 20px; } .login-error-layout[data-v-475ccfab] { -webkit-box-align: start !important; -ms-flex-align: start !important; align-items: flex-start !important; } .aviso-card[data-v-475ccfab] { width: calc(100vw - 18px); max-height: calc(100vh - var(--login-error-top-space) - 24px); overflow-y: auto; border-color: transparent !important; -webkit-box-shadow: none !important; box-shadow: none !important; } .margenMobile[data-v-475ccfab] { margin-top: 0 !important; margin-bottom: 2vh; } .aviso-header[data-v-475ccfab] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center; gap: 10px; } .aviso-title[data-v-475ccfab] { font-size: 1.7rem; line-height: 1.2; letter-spacing: 0.01em; text-wrap: balance; width: 100%; text-align: center; } .aviso-text[data-v-475ccfab] { font-size: 1.18rem; line-height: 1.38; letter-spacing: 0.005em; text-wrap: pretty; text-align: center; } } @media screen and (min-width: 961px) and (max-height: 680px) { .login-error-root[data-v-475ccfab] { --login-error-top-space: 24vh; padding-bottom: 10px; } .aviso-card[data-v-475ccfab] { padding: 12px 16px !important; } .aviso-card .mb-4[data-v-475ccfab] { margin-bottom: 8px !important; } .aviso-title[data-v-475ccfab] { font-size: 1.35rem; line-height: 1.15; } .aviso-text[data-v-475ccfab] { font-size: 1.06rem; line-height: 1.22; margin-bottom: 6px; } .aviso-actions .v-btn[data-v-475ccfab] { min-height: 36px !important; font-size: 0.92rem !important; margin-top: 0 !important; } } @media screen and (min-width: 961px) and (max-height: 620px) { .login-error-root[data-v-475ccfab] { --login-error-top-space: clamp(150px, 27vh, 190px); padding-bottom: 10px; } .aviso-card[data-v-475ccfab] { width: min(760px, calc(100% - 16px)); max-height: none; overflow: visible; padding: 12px 16px !important; } } @media screen and (min-width: 961px) and (max-height: 430px) { .login-error-root[data-v-475ccfab] { --login-error-top-space: 128px; padding-bottom: 6px; } .aviso-card[data-v-475ccfab] { width: min(760px, calc(100% - 12px)); padding: 8px 12px !important; } .aviso-title[data-v-475ccfab] { font-size: 1.05rem; line-height: 1.1; } .aviso-text[data-v-475ccfab] { font-size: 1.1rem; line-height: 1.14; margin-bottom: 3px; } .aviso-actions .v-btn[data-v-475ccfab] { min-height: 34px !important; font-size: 1rem; } } #imgDesktop[data-v-0e6bd5f0] { top: 0; height: 100vh; float: left; left: 0; position: fixed; } #imgMobile[data-v-0e6bd5f0] { top: 0; width: 100vw; left: 0; position: relative; } img[data-v-0e6bd5f0] { max-width: 100%; height: auto; } .login-content[data-v-0e6bd5f0] { height: 100vh; min-height: 100vh; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; overflow-x: hidden; overflow-y: auto; /* Permite scroll del formulario cuando no entra en viewport */ -webkit-overflow-scrolling: touch; } @media screen and (max-width: 960px) { .login-content[data-v-0e6bd5f0] { overflow-y: hidden; } } @media screen and (min-width: 961px) and (max-width: 1100px) { .login-content[data-v-0e6bd5f0] { padding-left: 14px; -webkit-box-sizing: border-box; box-sizing: border-box; } } @media screen and (min-width: 961px) and (max-height: 460px) { .login-content[data-v-0e6bd5f0] { overflow-y: hidden; } } @media screen and (min-width: 961px) and (max-width: 1100px) and (max-height: 460px) { .login-content[data-v-0e6bd5f0] { padding-top: 64px; -webkit-box-sizing: border-box; box-sizing: border-box; } } .login-container[data-v-0e6bd5f0] { -webkit-box-flex: 1; -ms-flex: 1; flex: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; /* CAMBIO CLAVE: Quitamos 'align-items: center' global */ /* align-items: center; <-- BORRA O COMENTA ESTO */ -webkit-box-align: stretch; -ms-flex-align: stretch; align-items: stretch; /* <-- AGREGA ESTO: Estira los hijos a toda la altura */ min-height: 100%; width: 100%; padding: 0; position: relative; /* Para que los hijos absolutos se posicionen bien */ } /* Y aseguramos que el componente hijo ocupe todo */ .login-container > .flex[data-v-0e6bd5f0] { min-height: 100%; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; } .step-host[data-v-0e6bd5f0] { width: 100%; margin-left: 0 !important; } /* --- ANIMACIÓN NUEVA (SLIDE FADE) --- */ /* Esto hace que el componente viejo se vaya suavemente y el nuevo entre deslizando */ .slide-fade-enter-active[data-v-0e6bd5f0], .slide-fade-leave-active[data-v-0e6bd5f0] { -webkit-transition: all 0.3s ease; transition: all 0.3s ease; } .slide-fade-enter[data-v-0e6bd5f0] { -webkit-transform: translateX(10px); transform: translateX(10px); opacity: 0; } .slide-fade-leave-to[data-v-0e6bd5f0] { -webkit-transform: translateX(-10px); transform: translateX(-10px); opacity: 0; } /* ------------------------------------ */ .textMobile { font-family: 'Montserrat'; font-weight: 100; } .titleMobile { font-family: 'Montserrat'; font-weight: 600; } .lthemetitle { color: #424242; } .dthemetitle { color: white; } @media screen and (max-width: 960px) { .headerMobileConFondo { background-image: url(/img/IMG-MOBILE-PORTAL.6e45a175.jpg); height: 58vw; background-repeat: no-repeat; position: relative; width: 100vw; margin-left: auto; margin-right: auto; background-position: top; background-size: 100%; margin-top: -3vw; } .headerMobileSinFondo { height: 50vw; margin-left: auto; margin-right: auto; margin-top: -20vw; position: relative; z-index: 2; overflow: visible; } .bordeBlanco { height: 10vw; border-radius: 9vw 9vw 0 0; background-color: white; position: relative; margin-top: -10vw; } } @media screen and (max-width: 960px) { .margenMobile[data-v-98907760] { margin-top: 0 !important; margin-bottom: 2vh; } .margenTop[data-v-98907760] { margin-top: -10vh; } } html[data-v-98907760], body[data-v-98907760] { height: 100%; overflow: hidden; } .error-page[data-v-98907760] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: center; height: 100%; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; } .error-page h1[data-v-98907760] { font-size: 15vh; font-weight: bold; position: relative; margin: -8vh 0 0; padding: 0; } .error-page h1[data-v-98907760]:after { content: attr(data-h1); position: absolute; top: 0; left: 0; right: 0; color: transparent; /* webkit only for graceful degradation to IE */ background: -webkit-repeating-linear-gradient(-45deg, #71b7e6, #69a6ce, #8accb3, #64d29d, #8accb3, #69a6ce, #9b59b6); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-size: 400%; text-shadow: 1px 1px 2px rgba(255, 255, 255, 0.25); -webkit-animation: animateTextBackground-data-v-98907760 10s ease-in-out infinite; animation: animateTextBackground-data-v-98907760 10s ease-in-out infinite; } .error-page h1 + p[data-v-98907760] { color: #d6d6d6; font-size: 6vh; font-weight: bold; line-height: 7vh; max-width: 600px; position: relative; } .error-page h1 + p[data-v-98907760]:after { content: attr(data-p); position: absolute; top: 0; left: 0; right: 0; color: transparent; text-shadow: 1px 1px 2px rgba(236, 236, 236, 0.5); -webkit-background-clip: text; -moz-background-clip: text; background-clip: text; } @-webkit-keyframes animateTextBackground-data-v-98907760 { 0% { background-position: 0 0; } 25% { background-position: 100% 0; } 50% { background-position: 100% 100%; } 75% { background-position: 0 100%; } 100% { background-position: 0 0; } } @keyframes animateTextBackground-data-v-98907760 { 0% { background-position: 0 0; } 25% { background-position: 100% 0; } 50% { background-position: 100% 100%; } 75% { background-position: 0 100%; } 100% { background-position: 0 0; } } @media (max-width: 767px) { .error-page h1[data-v-98907760] { font-size: 32vw; } .error-page h1 + p[data-v-98907760] { font-size: 8vw; line-height: 10vw; max-width: 70vw; } } a.back[data-v-98907760] { position: fixed; right: 40px; bottom: 40px; background: -webkit-repeating-linear-gradient(-45deg, #71b7e6, #69a6ce, #8accb3, #6aeeae); border-radius: 5px; -webkit-box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2); color: #fff; font-size: 16px; font-weight: bold; line-height: 24px; padding: 15px 30px; text-decoration: none; -webkit-transition: 0.25s all ease-in-out; transition: 0.25s all ease-in-out; } a.back[data-v-98907760]:hover { -webkit-box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4); box-shadow: 0 4px 20px rgba(0, 0, 0, 0.4); } .noPaddingBot[data-v-59dfc508] { padding-bottom: 0 !important; } .btn-justify[data-v-59dfc508] { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } @media screen and (max-width: 600px) { h1[data-v-59dfc508] { text-align: center !important; } .margenMobile[data-v-59dfc508] { margin-top: 0 !important; margin-bottom: 2vh; } .btn-justify[data-v-59dfc508] { -webkit-box-pack: left; -ms-flex-pack: left; justify-content: left; } } #alerta-error .v-alert__wrapper .v-icon::after { opacity: 0 !important; } #alerta-success .v-alert__wrapper .v-icon::after { opacity: 0 !important; } #imgDesktop[data-v-5c7e99fe] { top: 0; height: 100vh; float: left; left: 0; position: fixed; } #imgMobile[data-v-5c7e99fe] { top: 0; width: 100vw; left: 0; position: relative; } .textMobile { font-family: 'Montserrat'; font-weight: 100; } .titleMobile { font-family: 'Montserrat'; font-weight: 600; } .lthemetitle { color: #424242; } .dthemetitle { color: white; } @media screen and (max-width: 960px) { .headerMobileConFondo { background-image: url(/img/IMG-MOBILE-PORTAL.6e45a175.jpg); height: 58vw; background-repeat: no-repeat; position: relative; width: 100vw; margin-left: auto; margin-right: auto; background-position: top; background-size: 100%; margin-top: -3vw; } .headerMobileSinFondo { height: 50vw; margin-left: auto; margin-right: auto; margin-top: -20vw; } .bordeBlanco { height: 10vw; border-radius: 9vw 9vw 0 0; background-color: white; position: relative; margin-top: -10vw; } } .externo-card[data-v-5dcf302a] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; } .card-strip[data-v-5dcf302a] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-5dcf302a] { font-weight: 600; color: var(--color-text-secondary); } .externo-detail[data-v-5dcf302a] { padding: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .externo-detail__row[data-v-5dcf302a] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .externo-detail__key[data-v-5dcf302a] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .externo-detail__val[data-v-5dcf302a] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } .externo-footer[data-v-5dcf302a] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .externo-actions[data-v-5dcf302a] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .externo-action-btn[data-v-5dcf302a] { text-transform: none; letter-spacing: 0; } @media (max-width: 600px) { .externo-detail__row[data-v-5dcf302a] { grid-template-columns: 104px minmax(0, 1fr); } } .page-header[data-v-e016a2b6] { margin-bottom: 24px; } .page-title[data-v-e016a2b6] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-e016a2b6] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .top_buffer[data-v-e016a2b6] .loading-default, .top_buffer[data-v-e016a2b6] .loading-spiral, .top_buffer[data-v-e016a2b6] .loading-circles, .top_buffer[data-v-e016a2b6] .loading-bubbles, .top_buffer[data-v-e016a2b6] .loading-wave-dots { display: none !important; } .search-message-card[data-v-e016a2b6] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .search-message-card__text[data-v-e016a2b6] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .search-message-card__title[data-v-e016a2b6] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .search-message-card__sub[data-v-e016a2b6] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-e016a2b6] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-e016a2b6] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-e016a2b6] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-e016a2b6] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-e016a2b6] { padding: 16px 12px 80px; } .v-btn[data-v-e016a2b6] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .resultado-card[data-v-4ad28bba] { margin-bottom: 12px; padding: 0; border-left-width: 6px !important; border-left-style: solid !important; border-radius: var(--radius-2xl); overflow: hidden; } .card-strip[data-v-4ad28bba] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background: var(--color-primary-light); padding: 7px 16px; font-size: var(--font-size-small); color: var(--color-text-secondary); font-weight: 500; } .card-strip__fecha[data-v-4ad28bba] { font-weight: 600; color: var(--color-text-secondary); } .resultado-detail[data-v-4ad28bba] { padding: 0 20px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; margin-bottom: 16px; margin-top: 12px; } .resultado-detail__row[data-v-4ad28bba] { display: grid; grid-template-columns: 116px minmax(0, 1fr); -webkit-column-gap: 8px; -moz-column-gap: 8px; column-gap: 8px; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; } .resultado-detail__row--top[data-v-4ad28bba] { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .resultado-detail__key[data-v-4ad28bba] { font-size: 0.75rem; font-weight: 600; color: #95a5a6; text-transform: uppercase; letter-spacing: 0.5px; white-space: nowrap; text-align: right; justify-self: end; } .resultado-detail__val[data-v-4ad28bba] { font-size: 0.9rem; color: #2c3e50; min-width: 0; overflow-wrap: anywhere; text-align: left; justify-self: start; } .resultado-estudios-toggle[data-v-4ad28bba] { cursor: pointer; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 2px; color: #1282a2; font-size: 0.9rem; } .resultado-estudios-list[data-v-4ad28bba] { margin-top: 6px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 4px; } .resultado-estudio-item[data-v-4ad28bba] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.85rem; color: #2c3e50; padding-left: 4px; } /* ── Footer: botones + WhatsApp ── */ .resultado-footer[data-v-4ad28bba] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 20px 16px; border-top: 1px solid #f0f2f5; gap: 12px; -ms-flex-wrap: wrap; flex-wrap: wrap; } .resultado-actions[data-v-4ad28bba] { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; gap: 8px; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .resultado-action-btn[data-v-4ad28bba] { text-transform: none; letter-spacing: 0; } .resultado-whatsapp-link[data-v-4ad28bba] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 0.8rem; color: #25D366; font-weight: 600; text-decoration: none; -webkit-transition: opacity 0.15s; transition: opacity 0.15s; white-space: nowrap; margin-left: auto; } .resultado-whatsapp-link[data-v-4ad28bba]:hover { opacity: 0.75; } .resultado-loading-dot[data-v-4ad28bba] { width: 12px; height: 12px; border-radius: 50%; background: #25D366; display: inline-block; -webkit-animation: resultado-loading-pulse-data-v-4ad28bba 1.1s ease-in-out infinite; animation: resultado-loading-pulse-data-v-4ad28bba 1.1s ease-in-out infinite; } @-webkit-keyframes resultado-loading-pulse-data-v-4ad28bba { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @keyframes resultado-loading-pulse-data-v-4ad28bba { 0% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } 50% { opacity: 1; -webkit-transform: scale(1); transform: scale(1); } 100% { opacity: 0.35; -webkit-transform: scale(0.8); transform: scale(0.8); } } @media (max-width: 600px) { .resultado-detail__row[data-v-4ad28bba] { grid-template-columns: 104px minmax(0, 1fr); } .resultado-footer[data-v-4ad28bba] { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .resultado-whatsapp-link[data-v-4ad28bba] { margin-left: 0; } } .page-header[data-v-5ffe4959] { margin-bottom: 24px; } .page-title[data-v-5ffe4959] { font-size: 24px; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-5ffe4959] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .top_buffer[data-v-5ffe4959] { margin-top: 20px; } .top_buffer[data-v-5ffe4959] .loading-default { display: none !important; } .loading-message-card[data-v-5ffe4959] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__text[data-v-5ffe4959] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-5ffe4959] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-5ffe4959] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-5ffe4959] { background: #eef6fb; border-radius: 14px; padding: 32px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; text-align: center; } .empty-state-card__icon[data-v-5ffe4959] { font-size: 2.5rem !important; color: #5a9ab5; margin-bottom: 8px; } .empty-state-card__title[data-v-5ffe4959] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .empty-state-card__sub[data-v-5ffe4959] { font-size: 0.82rem; color: #5a9ab5; } @media (max-width: 600px) { .page-container[data-v-5ffe4959] { padding: 16px 12px 80px; } .v-btn[data-v-5ffe4959] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } /* ESTILOS IGUALES A LOS ANTERIORES */ .tarjeta-wrapper[data-v-031e24f5] { width: 100%; max-width: 520px; margin: 0.5rem auto; } .tarjeta-credencial-universal[data-v-031e24f5] { font-family: 'Roboto', sans-serif; width: 100%; border-radius: 16px; overflow: hidden; position: relative; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; -webkit-box-shadow: 0 4px 15px rgba(0,0,0,0.25); box-shadow: 0 4px 15px rgba(0,0,0,0.25); } .tarjeta-acciones[data-v-031e24f5] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 4px; padding: 4px 4px 0; } .tarjeta-accion-btn[data-v-031e24f5] { width: 28px; height: 28px; min-width: 28px !important; opacity: 0.7; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; } .tarjeta-accion-btn[data-v-031e24f5]:hover { opacity: 1; } .borde-default[data-v-031e24f5] { border: 1px solid #e0e0e0; border-left: none; -webkit-box-shadow: 0 4px 15px rgba(0,0,0,0.15); box-shadow: 0 4px 15px rgba(0,0,0,0.15); } .header-universal[data-v-031e24f5] { padding: 8px 1rem; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-height: 80px; } .logo-container[data-v-031e24f5] { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; line-height: 0; } .logo-img[data-v-031e24f5] { display: block; width: min(280px, 100%); max-width: min(280px, 100%); max-height: 85px; height: auto; -o-object-fit: contain; object-fit: contain; -o-object-position: center; object-position: center; margin-bottom: 2px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-user-drag: none; pointer-events: none; } .titulo-os[data-v-031e24f5] { font-size: 1.5rem; font-weight: 700; text-transform: uppercase; text-align: center; letter-spacing: 1px; } .linea-separadora[data-v-031e24f5] { width: 100%; height: 1px; margin-top: -1px; } .cuerpo-universal[data-v-031e24f5] { padding: 0.82rem 1.6rem 0.9rem; text-align: center; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; } .tarjeta-credencial-universal.texto-claro[data-v-031e24f5] { color: #f8f9fa; } .tarjeta-credencial-universal.texto-oscuro[data-v-031e24f5] { color: #212529; } .cuerpo-contenido[data-v-031e24f5] { display: block; width: 100%; } .cuerpo-contenido.con-token[data-v-031e24f5] { display: grid; grid-template-columns: minmax(0, 1fr) auto; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-column-gap: 1rem; -moz-column-gap: 1rem; column-gap: 1rem; } .info-principal[data-v-031e24f5] { min-width: 0; padding-top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: left; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; } .cuerpo-contenido.con-token .token-wrapper[data-v-031e24f5] { margin-top: 2px; min-width: 190px; justify-self: end; } .cuerpo-contenido.con-token .token-box[data-v-031e24f5] { width: 100%; } .nombre-paciente[data-v-031e24f5] { font-size: 0.95rem; font-weight: 500; text-transform: uppercase; margin-bottom: 1px; letter-spacing: 0.4px; } .numero-beneficiario[data-v-031e24f5] { font-size: 1.05rem; font-weight: 400; letter-spacing: 0.3px; line-height: 1.05; margin-bottom: 1px; } .plan-info[data-v-031e24f5] { font-size: 0.8rem; font-weight: 400; opacity: 0.85; } .token-wrapper[data-v-031e24f5] { margin-top: 0; } .token-box[data-v-031e24f5] { border-radius: 14px; padding: 3px 12px 5px 12px; border-width: 1px; border-style: solid; -webkit-box-shadow: 0 4px 12px rgba(0,0,0,0.08); box-shadow: 0 4px 12px rgba(0,0,0,0.08); } .token-content[data-v-031e24f5] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 3px; padding-top: 0; } .token-header[data-v-031e24f5] { width: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: -8px; } .token-actions[data-v-031e24f5] { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 2px; opacity: 0; -webkit-transition: opacity 0.2s ease; transition: opacity 0.2s ease; } .token-actions .v-btn[disabled][data-v-031e24f5] { opacity: 0.45; } .token-box:hover .token-actions[data-v-031e24f5] { opacity: 1; } .token-label[data-v-031e24f5] { font-size: 0.65rem; font-weight: 700; letter-spacing: 1px; text-transform: uppercase; line-height: 1rem; } .token-value[data-v-031e24f5] { font-family: 'Courier New', monospace; font-size: 2.9rem; font-weight: 700; letter-spacing: 5px; text-align: center; margin-top: 1px; line-height: 1; } .token-vencimiento[data-v-031e24f5] { font-size: 0.7rem; margin-top: 0; text-align: center; min-height: 18px; } .cargando-token[data-v-031e24f5] { opacity: 0.6; -webkit-animation: pulse-data-v-031e24f5 1.5s infinite; animation: pulse-data-v-031e24f5 1.5s infinite; } @-webkit-keyframes pulse-data-v-031e24f5 { 0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.6; } } @keyframes pulse-data-v-031e24f5 { 0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.6; } } @media screen and (max-width: 600px) { .tarjeta-wrapper[data-v-031e24f5] { max-width: 100%; } .tarjeta-credencial-universal[data-v-031e24f5] { max-width: 100%; } .logo-img[data-v-031e24f5] { width: min(240px, 100%); max-width: min(240px, 100%); max-height: 75px; margin-bottom: 2px; } .cuerpo-contenido.con-token[data-v-031e24f5] { display: block; } .cuerpo-universal[data-v-031e24f5] { padding: 0.82rem 1.1rem 0.95rem; } .cuerpo-contenido.con-token .token-wrapper[data-v-031e24f5] { margin-top: 0.85rem; min-width: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; } .cuerpo-contenido.con-token .token-box[data-v-031e24f5] { margin: 0 auto; } } .page-header[data-v-3ba82b45] { margin-bottom: 24px; } .page-title[data-v-3ba82b45] { font-size: 1.5rem; font-weight: 600; color: #2c3e50; line-height: 1.2; margin: 0 0 4px 0; } .page-subtitle[data-v-3ba82b45] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .loading-message-card[data-v-3ba82b45] { background: #eef6fb; border-radius: 14px; padding: 16px 18px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 6px; overflow: hidden; position: relative; margin-bottom: 16px; } .loading-message-card__bar[data-v-3ba82b45] { position: absolute; top: 0; left: 0; right: 0; height: 3px; background: -webkit-gradient(linear, left top, right top, from(#1282a2), color-stop(50%, #a8d8ea), to(#1282a2)); background: linear-gradient(90deg, #1282a2 0%, #a8d8ea 50%, #1282a2 100%); background-size: 200% 100%; -webkit-animation: loading-bar-data-v-3ba82b45 1.6s ease-in-out infinite; animation: loading-bar-data-v-3ba82b45 1.6s ease-in-out infinite; } @-webkit-keyframes loading-bar-data-v-3ba82b45 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes loading-bar-data-v-3ba82b45 { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } .loading-message-card__text[data-v-3ba82b45] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; } .loading-message-card__title[data-v-3ba82b45] { font-size: 0.95rem; font-weight: 600; color: #1282a2; } .loading-message-card__sub[data-v-3ba82b45] { font-size: 0.82rem; color: #5a9ab5; } .empty-state-card[data-v-3ba82b45] { max-width: 520px; margin: 3rem auto; padding: 40px 20px; text-align: center; background: #f8f9fa; border: 1px solid #e0e0e0; border-radius: 12px; } .empty-state-card__title[data-v-3ba82b45] { font-size: 1.1rem; font-weight: 600; color: #2c3e50; margin: 12px 0 4px 0; } .empty-state-card__subtitle[data-v-3ba82b45] { font-size: 0.875rem; color: #95a5a6; margin: 0; } .modal-header[data-v-3ba82b45] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 16px 20px; background: #f8f9fa; border-bottom: 1px solid #e0e0e0; } .modal-header h2[data-v-3ba82b45] { font-size: 1.1rem; font-weight: 600; color: #2c3e50; margin: 0; } .credenciales-section-header[data-v-3ba82b45] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 8px; margin-bottom: 12px; } .credenciales-section-header__icon[data-v-3ba82b45] { -ms-flex-negative: 0; flex-shrink: 0; } .credenciales-section-header__title[data-v-3ba82b45] { font-size: 0.75rem; font-weight: 700; color: #5f6b7a; text-transform: uppercase; letter-spacing: 0.5px; margin: 0; } .credenciales-grid[data-v-3ba82b45] { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: 1.5rem; justify-items: center; margin-bottom: 24px; } .text-center[data-v-3ba82b45] { text-align: center; } .mt-8[data-v-3ba82b45] { margin-top: 32px; } .mb-6[data-v-3ba82b45] { margin-bottom: 24px; } @media screen and (max-width: 960px) { .page-header[data-v-3ba82b45] { padding-top: 56px; } .credenciales-grid[data-v-3ba82b45] { grid-template-columns: 1fr; } } @media (max-width: 600px) { .v-btn[data-v-3ba82b45] { text-transform: none !important; white-space: normal !important; word-break: break-word !important; font-size: 0.85rem !important; } } .v-list-item--active[data-v-7ef4f1d2] { background-color: #eef6fb !important; border-left: 3px solid #1282a2 !important; } .v-navigation-drawer .v-list-item[data-v-7ef4f1d2] { border-left: 3px solid transparent; min-height: 48px; } .v-navigation-drawer--mini-variant .v-list-item[data-v-7ef4f1d2] { border-left: none !important; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .v-navigation-drawer--mini-variant .v-list-item .v-list-item__icon[data-v-7ef4f1d2] { margin: 0 !important; -ms-flex-item-align: center !important; align-self: center !important; } .v-list-item--active .v-icon[data-v-7ef4f1d2] { color: #1282a2 !important; } .v-list-item--active .v-list-item__title[data-v-7ef4f1d2] { color: #1282a2 !important; font-weight: 600 !important; } .user-header[data-v-7ef4f1d2] { padding: 16px !important; display: -webkit-box !important; display: -ms-flexbox !important; display: flex !important; -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; gap: 12px !important; } .user-avatar[data-v-7ef4f1d2] { width: 40px; height: 40px; border-radius: 50%; background: #1282a2 !important; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 0.95rem; font-weight: 600; color: white; -ms-flex-negative: 0; flex-shrink: 0; text-transform: uppercase; /* color kept white — avatar bg is #1282a2 */ } .user-info[data-v-7ef4f1d2] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; gap: 2px; overflow: hidden; } .user-name[data-v-7ef4f1d2] { font-size: 0.85rem; font-weight: 600; color: #2c3e50 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .user-sub[data-v-7ef4f1d2] { font-size: 0.72rem; color: #7f8c8d !important; } .title-portal[data-v-7ef4f1d2] { font-size: 16px !important; text-align: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 18px 0px; } @media screen and (min-width: 960px) { .desktop[data-v-7ef4f1d2] { margin-left: 256px; } .desktop.mini[data-v-7ef4f1d2] { margin-left: 56px; } } @media screen and (max-width: 959px) { .mobile-main-offset[data-v-7ef4f1d2] { overflow-y: auto; -webkit-overflow-scrolling: touch; } } .drawer-header[data-v-7ef4f1d2] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px 16px; width: 100%; } .drawer-logo[data-v-7ef4f1d2] { max-height: 36px; max-width: 150px; -o-object-fit: contain; object-fit: contain; -webkit-filter: none; filter: none; } .collapse-btn[data-v-7ef4f1d2] { color: #7f8c8d !important; -ms-flex-negative: 0; flex-shrink: 0; width: 36px !important; height: 36px !important; min-width: 36px !important; border-radius: 10px !important; display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; -webkit-transition: width 220ms ease, height 220ms ease, min-width 220ms ease; transition: width 220ms ease, height 220ms ease, min-width 220ms ease; } .collapse-btn .v-icon[data-v-7ef4f1d2] { font-size: 26px !important; line-height: 1 !important; -webkit-transition: font-size 220ms ease, -webkit-transform 220ms ease; transition: font-size 220ms ease, -webkit-transform 220ms ease; transition: font-size 220ms ease, transform 220ms ease; transition: font-size 220ms ease, transform 220ms ease, -webkit-transform 220ms ease; } .v-navigation-drawer--mini-variant .drawer-header[data-v-7ef4f1d2] { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 10px 0; } .v-navigation-drawer--mini-variant .collapse-btn[data-v-7ef4f1d2] { width: 44px !important; height: 44px !important; min-width: 44px !important; } .v-navigation-drawer--mini-variant .collapse-btn .v-icon[data-v-7ef4f1d2] { font-size: 32px !important; } .v-navigation-drawer--mini-variant .user-header[data-v-7ef4f1d2] { -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; padding: 10px 0 !important; gap: 0 !important; } .v-navigation-drawer--mini-variant .user-info[data-v-7ef4f1d2] { display: none !important; } .v-navigation-drawer--mini-variant .user-avatar[data-v-7ef4f1d2] { margin: 0 auto; } .main-content[data-v-7ef4f1d2] { width: 100%; } .mobile-route-header[data-v-7ef4f1d2] { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; gap: 10px; padding: 8px 10px; position: fixed; top: 0; left: 0; right: 0; z-index: 150; background: #eceded; border-bottom: 1px solid #dfe5e8; -ms-touch-action: pan-y; touch-action: pan-y; } .mobile-route-header__menu[data-v-7ef4f1d2] { background-color: white !important; -webkit-box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important; } .mobile-route-header__title[data-v-7ef4f1d2] { margin: 0; font-size: 1.1rem; line-height: 1.1; font-weight: 600; color: #2c3e50; } .v-navigation-drawer .v-list-item__title { color: #2c3e50 !important; } .v-navigation-drawer .v-icon { color: #5a7a8a !important; line-height: 1 !important; } .v-navigation-drawer .v-list-item__icon { width: 24px !important; min-width: 24px !important; margin-right: 16px !important; display: -webkit-inline-box !important; display: -ms-inline-flexbox !important; display: inline-flex !important; -webkit-box-align: center !important; -ms-flex-align: center !important; align-items: center !important; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .v-navigation-drawer--mini-variant .v-list-item { padding: 0 !important; -webkit-box-pack: center !important; -ms-flex-pack: center !important; justify-content: center !important; } .v-navigation-drawer--mini-variant .v-list-item__icon { width: 24px !important; min-width: 24px !important; margin: 0 auto !important; } #app { font-family: "Roboto", sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; /*margin-top: 60px;*/ } .background { background-color: #eceded; } .titesp { width: 250px !important; } .pad-icon { padding: 10px; font-size: 0.8rem; } .pad-no { padding: 0px; } .e { margin-left: 15%; } .m { margin: 0.5em; } @media (max-width: 959px) { .page-header, .filtros-header { padding-top: 0 !important; margin-bottom: 40px !important; } .page-header .page-title, .page-header .page-subtitle, .filtros-header .filtros-title, .filtros-header .filtros-subtitle { display: none !important; } } /* ============================================================ Design Tokens — Portal Alephoo Single source of truth for all visual values. Import this file; never hardcode these values in components. ============================================================ */ :root { /* ---------------------------------------------------------- Brand colors ---------------------------------------------------------- */ --color-primary: #1282A2; --color-primary-dark: #0e6e8a; --color-primary-light: #e8f4f8; --color-secondary: #001F54; --color-tertiary: #0A1128; /* ---------------------------------------------------------- Text colors ---------------------------------------------------------- */ --color-text-primary: #2c3e50; --color-text-secondary: #5f6b7a; --color-text-muted: #95a5a6; --color-text-hint: #5f6368; --color-text-on-primary: #ffffff; /* ---------------------------------------------------------- Surface colors ---------------------------------------------------------- */ --color-surface-page: #f0f2f5; --color-surface-card: #ffffff; --color-surface-selected: #E3F2FD; --color-surface-hover: #f5f9ff; /* ---------------------------------------------------------- Border colors ---------------------------------------------------------- */ --color-border-subtle: rgba(0, 0, 0, 0.08); --color-border-light: rgba(0, 0, 0, 0.05); --color-border-medium: #cfd8dc; --color-border-focus: #1282A2; /* ---------------------------------------------------------- Semantic colors ---------------------------------------------------------- */ --color-success: #2E7D32; --color-error: #E53935; --color-warning: #F57C00; --color-info: #1565C0; /* ---------------------------------------------------------- Typography ---------------------------------------------------------- */ --font-family-base: 'Roboto', sans-serif; --font-size-h1: 2.2rem; --font-size-h2: 1.5rem; --font-size-h3: 1.2rem; --font-size-body: 1rem; --font-size-body-lg: 1.1rem; --font-size-small: 0.875rem; --font-size-caption: 0.75rem; --font-weight-regular: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --line-height-tight: 1.2; --line-height-base: 1.5; --line-height-relaxed: 1.7; /* ---------------------------------------------------------- Spacing scale (8px base) ---------------------------------------------------------- */ --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px; --space-16: 64px; /* ---------------------------------------------------------- Border radius ---------------------------------------------------------- */ --radius-sm: 4px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 16px; --radius-2xl: 24px; --radius-pill: 99px; /* ---------------------------------------------------------- Shadows ---------------------------------------------------------- */ --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.08); --shadow-card-hover: 0 4px 16px rgba(0, 0, 0, 0.12); --shadow-elevated: 0 8px 24px rgba(0, 0, 0, 0.12); /* ---------------------------------------------------------- Layout ---------------------------------------------------------- */ --content-max-width: 780px; --content-max-width-narrow: 480px; --sidebar-width: 300px; /* ---------------------------------------------------------- Transitions ---------------------------------------------------------- */ --transition-fast: 150ms ease; --transition-base: 250ms ease; --transition-slow: 350ms ease; /* ---------------------------------------------------------- Z-index scale ---------------------------------------------------------- */ --z-drawer: 200; --z-overlay: 300; --z-modal: 400; --z-toast: 500; } /* ============================================================ Base Styles — Portal Alephoo Reusable utility classes for interior screens. All values reference tokens from tokens.css. ============================================================ */ /* ---------------------------------------------------------- Page layout ---------------------------------------------------------- */ .page-background { background-color: var(--color-surface-page); min-height: 100vh; } .page-container { width: 100%; max-width: 1200px; margin: 0 auto; padding: 16px 32px 80px; } .page-header { margin-bottom: 24px; } @media (max-width: 960px) { .page-header { padding-top: 56px; } .page-container { max-width: 100%; padding: 16px 16px 80px; } } @media (max-width: 600px) { .page-container { padding: 16px 12px 80px; } } /* ---------------------------------------------------------- Card base ---------------------------------------------------------- */ .app-card { background-color: var(--color-surface-card); border: 1px solid var(--color-border-subtle); border-radius: var(--radius-2xl); -webkit-box-shadow: var(--shadow-card); box-shadow: var(--shadow-card); -webkit-transition: -webkit-box-shadow var(--transition-base); transition: -webkit-box-shadow var(--transition-base); transition: box-shadow var(--transition-base); transition: box-shadow var(--transition-base), -webkit-box-shadow var(--transition-base); } .app-card--hoverable:hover { -webkit-box-shadow: var(--shadow-card-hover); box-shadow: var(--shadow-card-hover); } .app-card--elevated { -webkit-box-shadow: var(--shadow-elevated); box-shadow: var(--shadow-elevated); } /* Mobile: no border, no shadow */ @media (max-width: 960px) { .app-card { border-color: transparent; -webkit-box-shadow: none; box-shadow: none; } } /* ---------------------------------------------------------- Typography ---------------------------------------------------------- */ .text-heading { font-size: var(--font-size-h1); font-weight: var(--font-weight-bold); color: var(--color-text-primary); line-height: var(--line-height-tight); } .text-subheading { font-size: var(--font-size-h2); font-weight: var(--font-weight-semibold); color: var(--color-text-primary); } .text-body { font-size: var(--font-size-body); color: var(--color-text-primary); line-height: var(--line-height-base); } .text-muted { color: var(--color-text-muted); } .text-secondary { color: var(--color-text-secondary); } /* ---------------------------------------------------------- Input base (deep selectors for Vuetify overrides) ---------------------------------------------------------- */ .input-base >>> .v-input__control { min-height: 56px; } .input-base >>> input, .input-base >>> .v-select__selection { font-size: var(--font-size-body-lg) !important; color: var(--color-text-primary) !important; } .input-base >>> .v-label { font-size: var(--font-size-body-lg) !important; } .input-base >>> .v-input__slot fieldset { background-color: transparent !important; } .input-base.v-text-field--outlined >>> .v-input__slot { background-color: var(--color-surface-card) !important; } /* ---------------------------------------------------------- Step indicator ---------------------------------------------------------- */ .step-indicator { display: -webkit-box; display: -ms-flexbox; display: flex; gap: var(--space-2); margin-bottom: var(--space-6); } .step-indicator__segment { height: 4px; border-radius: var(--radius-sm); background-color: var(--color-border-medium); -webkit-box-flex: 1; -ms-flex: 1; flex: 1; -webkit-transition: background-color var(--transition-base); transition: background-color var(--transition-base); } .step-indicator__segment--active { background-color: var(--color-primary); } .step-indicator__segment--completed { background-color: var(--color-primary); opacity: 0.5; } /* ---------------------------------------------------------- Empty state ---------------------------------------------------------- */ .empty-state { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: var(--space-16) var(--space-8); text-align: center; color: var(--color-text-muted); } .empty-state__icon { font-size: 48px; margin-bottom: var(--space-4); color: var(--color-border-medium); } .empty-state__title { font-size: var(--font-size-h3); font-weight: var(--font-weight-medium); color: var(--color-text-secondary); margin-bottom: var(--space-2); } .empty-state__text { font-size: var(--font-size-body); color: var(--color-text-muted); } /* ---------------------------------------------------------- Error state ---------------------------------------------------------- */ .error-state { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: var(--space-10) var(--space-8); text-align: center; } .error-state__icon { color: var(--color-error); font-size: 40px; margin-bottom: var(--space-4); } /* ---------------------------------------------------------- Loading skeleton ---------------------------------------------------------- */ .skeleton { background: -webkit-gradient( linear, left top, right top, color-stop(25%, var(--color-border-medium)), color-stop(50%, var(--color-surface-hover)), color-stop(75%, var(--color-border-medium)) ); background: linear-gradient( 90deg, var(--color-border-medium) 25%, var(--color-surface-hover) 50%, var(--color-border-medium) 75% ); background-size: 200% 100%; -webkit-animation: skeleton-loading 1.5s infinite; animation: skeleton-loading 1.5s infinite; border-radius: var(--radius-md); } @-webkit-keyframes skeleton-loading { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } } @keyframes skeleton-loading { 0% { background-position: 200% 0; } 100% { background-position: -200% 0; } }