/** * Qhali — manual de marca (override final, carga al final del ) */ :root { --qhali-primary: #163058; --qhali-secondary: #5e8739; --qhali-success: #9fbe61; --qhali-light: #f2ede4; --qhali-gradient: linear-gradient(90deg, #163058 0%, #5e8739 45%, #9fbe61 100%); --blue: #163058; --primary: #163058; --green: #5e8739; --success: #9fbe61; --default: #163058; --info: #5e8739; --purple: #5e8739; --teal: #9fbe61; --cyan: #9fbe61; } body { font-family: 'Lato', 'Open Sans', sans-serif !important; } /* ========== Links — solo modo claro (no pisar footer/enlaces en oscuro) ========== */ html:not(.dark-mode) a:not(.btn):not(.sc_button):not(.btn-primary):not(.btn-default):not(.btn-success):not(.btn-neutral):not(.btn-outline-primary):not(.btn-cart), html:not(.dark-mode) a:not(.btn):not(.sc_button):focus, html:not(.dark-mode) .text-primary, html:not(.dark-mode) a.text-primary:not(.btn), html:not(.dark-mode) .slide_title.text-primary, html:not(.dark-mode) h1.slide_title.text-primary, html:not(.dark-mode) .sc_title .text-primary { color: var(--qhali-primary) !important; } html:not(.dark-mode) a:not(.btn):not(.sc_button):hover, html:not(.dark-mode) a.text-primary:not(.btn):hover, html:not(.dark-mode) .text-primary:hover { color: var(--qhali-secondary) !important; } /* ========== Botones — texto blanco sobre fondo de marca ========== */ a.btn, .btn, .btn-default, .btn.btn-default, .btn-primary, .btn.btn-primary, .sc_button, .sc_services .btn, input[type="submit"].btn-primary, input[type="submit"].btn-default { background-color: var(--qhali-primary) !important; border-color: var(--qhali-primary) !important; color: #ffffff !important; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); } a.btn:hover, a.btn:focus, .btn-default:hover, .btn-default:focus, .btn-default:active, .btn.btn-default:hover, .btn.btn-default:focus, .btn.btn-default:active, .btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn.btn-primary:hover, .btn.btn-primary:focus, .btn.btn-primary:active, .sc_button:hover, .sc_button:focus, .open .dropdown-toggle.btn-default, .open .dropdown-toggle.btn-primary { background-color: var(--qhali-secondary) !important; border-color: var(--qhali-secondary) !important; color: #ffffff !important; } .btn-success, .btn.btn-success { background-color: var(--qhali-secondary) !important; border-color: var(--qhali-secondary) !important; color: #ffffff !important; } .btn-success:hover, .btn-success:focus, .btn.btn-success:hover { background-color: #4a6d2e !important; border-color: #4a6d2e !important; color: #ffffff !important; } .btn-neutral, .btn.btn-neutral { background-color: var(--qhali-light) !important; border-color: #d4cfc4 !important; color: var(--qhali-primary) !important; } .btn-neutral:hover, .btn.btn-neutral:hover { background-color: #e8e2d6 !important; color: var(--qhali-primary) !important; } a.btn span, a.btn .btn-inner--text, .btn-default span, .btn-primary span, .btn.btn-default span, .btn.btn-primary span { color: inherit !important; background: transparent !important; } /* ========== Menú header — hover legible (no hereda color verde de links) ========== */ header .topWrap .menuTopWrap #mainmenu > li > a:hover, header .topWrap .menuTopWrap #mainmenu > li > a:focus { background-color: var(--qhali-primary) !important; color: #ffffff !important; } header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a, header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a:hover, header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a:focus { background-color: var(--qhali-primary) !important; color: #ffffff !important; } header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a, header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:hover, header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:focus { background-color: var(--qhali-secondary) !important; color: #ffffff !important; } header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:hover, header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:focus { background-color: #4a6d2e !important; } header .topWrap .menuTopWrap #mainmenu > li ul > li > a { background-color: var(--qhali-secondary) !important; color: rgba(255, 255, 255, 0.85) !important; } header .topWrap .menuTopWrap #mainmenu > li ul > li > a:hover, header .topWrap .menuTopWrap #mainmenu > li ul > li > a:focus { background-color: #4a6d2e !important; color: #ffffff !important; } header .topWrap .menuTopWrap #mainmenu > li ul > li.current-menu-item > a, header .topWrap .menuTopWrap #mainmenu > li ul > li.current-menu-item > a:hover { background-color: #4a6d2e !important; color: #ffffff !important; } .responsive_menu header .topWrap .menuTopWrap #mainmenu > li > a:hover, .responsive_menu header .topWrap .menuTopWrap #mainmenu > li > a:focus { background-color: var(--qhali-secondary) !important; color: #ffffff !important; } .responsive_menu header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a, .responsive_menu header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a:hover { background-color: var(--qhali-success) !important; color: #163058 !important; } .responsive_menu header .topWrap .menuTopWrap #mainmenu > li ul > li > a, .responsive_menu header .topWrap .menuTopWrap #mainmenu > li ul > li > a:hover { background-color: #4a6d2e !important; color: #ffffff !important; } .bg-primary, .label-primary, .badge-primary, .pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover { background-color: var(--qhali-primary) !important; border-color: var(--qhali-primary) !important; color: #fff !important; } /* ========== Navbar front (reemplaza morado #6f51c7) ========== */ .navbar-default .navbar-nav > li > a:hover, .navbar-default .navbar-nav > li > a:focus, .navbar-default .navbar-nav > .active > a, .navbar-default .navbar-nav > .active > a:hover, .navbar-default .navbar-nav > .active > a:focus, .navbar-default .navbar-nav > .open > a, .navbar-default .navbar-nav > .open > a:hover, .navbar-default .navbar-nav > .open > a:focus, .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus, .navbar-default .navbar-nav .open .dropdown-menu > .active > a, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover, .navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus { background-color: var(--qhali-primary) !important; color: #fff !important; } header .topWrap .logo .navbar-brand { color: var(--qhali-primary) !important; } header .topWrap .logo .navbar-brand:hover { color: var(--qhali-secondary) !important; } header .topWrap .logo .navbar-brand .logo_main, .header_style_2 header .topWrap .logo .navbar-brand img { width: auto !important; height: 110px !important; max-width: 220px !important; object-fit: contain !important; margin-top: 0 !important; } .header_style_2 header .topWrap .logo .navbar-brand img { height: 88px !important; max-width: 180px !important; } /* ========== Header una sola línea (logo + menú + contacto) ========== */ .header_style_2 header .topWrap.qhali-header-row { display: flex !important; align-items: center !important; justify-content: space-between !important; flex-wrap: nowrap !important; gap: 12px; padding: 10px 0 12px !important; } .header_style_2 header .topWrap.qhali-header-row .logo, .header_style_2 header .topWrap.qhali-header-row .logo.logo_left { float: none !important; padding-bottom: 0 !important; flex: 0 0 auto; margin: 0 !important; } .header_style_2 header .topWrap.qhali-header-row .logo .navbar-brand { margin-bottom: 0 !important; margin-left: 0 !important; display: inline-flex !important; align-items: center !important; line-height: 1 !important; vertical-align: middle !important; } .header_style_2 header .topWrap.qhali-header-row .logo .navbar-brand img, .header_style_2 header .topWrap.qhali-header-row .logo .navbar-brand .logo_main { height: 52px !important; max-height: 52px !important; max-width: 130px !important; width: auto !important; margin-top: 0 !important; margin-bottom: 0 !important; display: block !important; } .header_style_2 header .topWrap.qhali-header-row .bottomWrap, .header_style_2 header .topWrap.qhali-header-row .qhali-header-nav { float: none !important; flex: 1 1 auto; display: flex !important; align-items: center !important; justify-content: center !important; position: relative; min-width: 0; } .header_style_2 header .topWrap.qhali-header-row .bottomWrap:before { display: none !important; } .header_style_2 header .topWrap.qhali-header-row .menuTopWrap { padding-top: 0 !important; padding-bottom: 0 !important; width: 100%; } .header_style_2 header .topWrap.qhali-header-row .menuTopWrap #mainmenu { display: inline-flex !important; flex-wrap: wrap; align-items: center; justify-content: center; margin-left: 0 !important; } .header_style_2 header .topWrap.qhali-header-row .menuTopWrap #mainmenu > li { float: none !important; display: flex !important; align-items: center; } .header_style_2 header .topWrap.qhali-header-row .menuTopWrap #mainmenu > li > a { display: inline-flex !important; align-items: center !important; height: auto !important; min-height: 28px; line-height: 1.2 !important; padding: 4px 14px !important; } .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact { flex: 0 0 auto; white-space: nowrap; } .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area { padding: 0 !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.3 !important; float: none !important; color: var(--qhali-primary) !important; } .header_style_2 header .topWrap.qhali-header-row .openResponsiveMenu { display: none; } .header_style_2 header .topWrap.qhali-header-row .qhali-register-menu > .sub-menu { min-width: 200px; text-align: left; } .header_style_2 header .topWrap.qhali-header-row .menuTopWrap, .header_style_2 header .topWrap.qhali-header-row .qhali-header-nav { overflow: visible !important; } @media (max-width: 991px) { .header_style_2 header .topWrap.qhali-header-row { flex-wrap: wrap !important; justify-content: center !important; row-gap: 8px; } .header_style_2 header .topWrap.qhali-header-row .logo { order: 1; width: 100%; text-align: center; } .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact { order: 2; width: 100%; text-align: center; } .header_style_2 header .topWrap.qhali-header-row .bottomWrap { order: 3; width: 100%; } .header_style_2 header .topWrap.qhali-header-row .openResponsiveMenu { display: block; position: absolute; right: 0; top: 50%; transform: translateY(-50%); } } header .topWrap .logo .navbar-brand .logo_text { display: none !important; } /* ========== Admin Argon ========== */ .bg-gradient-primary { background: var(--qhali-gradient) !important; } .bg-gradient-success { background: linear-gradient(87deg, #5e8739 0, #9fbe61 100%) !important; } .btn-outline-primary { color: var(--qhali-primary) !important; border-color: var(--qhali-primary) !important; } .btn-outline-primary:hover { background-color: var(--qhali-primary) !important; border-color: var(--qhali-primary) !important; color: #fff !important; } .nav-link.active .ni, .navbar-vertical .navbar-nav .nav-link.active { color: var(--qhali-primary) !important; } .navbar-vertical .navbar-nav .nav-link.active:before { border-color: var(--qhali-secondary) !important; } .navbar-brand-img, .qhali-sidebar-logo img { object-fit: contain !important; max-height: 96px !important; min-height: auto !important; width: auto !important; } .qhali-sidebar-logo { background: #ffffff; border-radius: 12px; padding: 8px 10px; } .navbar-collapse-header .collapse-brand img { max-height: 56px; width: auto; object-fit: contain; background: #ffffff; border-radius: 10px; padding: 4px 8px; } html.dark-mode .qhali-sidebar-logo, html.dark-mode .navbar-collapse-header .collapse-brand img { background: #f2ede4; } .login-heading h2 { color: var(--qhali-primary) !important; } .login-card .input-group-alternative:focus-within { border-color: var(--qhali-primary) !important; box-shadow: 0 0 0 3px rgba(22, 48, 88, 0.15) !important; } .login-card .btn-primary { background: var(--qhali-gradient) !important; border: none !important; } .sc_slider, .top_panel_wrap { background-color: var(--qhali-light) !important; } html:not(.dark-mode) footer a, html:not(.dark-mode) .layout_footer a { color: var(--qhali-primary) !important; } html:not(.dark-mode) footer a:hover, html:not(.dark-mode) .layout_footer a:hover { color: var(--qhali-secondary) !important; } /* ========== Modo oscuro — botones legibles ========== */ html.dark-mode a.btn, html.dark-mode .btn, html.dark-mode .btn-default, html.dark-mode .btn.btn-default, html.dark-mode .btn-primary, html.dark-mode .btn.btn-primary, html.dark-mode .sc_button, html.dark-mode .sc_services .btn, html.dark-mode input[type="submit"].btn-primary, html.dark-mode input[type="submit"].btn-default { background-color: var(--qhali-secondary) !important; border-color: var(--qhali-secondary) !important; color: #ffffff !important; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.35); } html.dark-mode a.btn span, html.dark-mode a.btn .btn-inner--text, html.dark-mode .btn-default span, html.dark-mode .btn-primary span { color: #ffffff !important; background: transparent !important; } html.dark-mode a.btn:hover, html.dark-mode .btn-default:hover, html.dark-mode .btn.btn-default:hover, html.dark-mode .btn-primary:hover, html.dark-mode .btn.btn-primary:hover, html.dark-mode .sc_button:hover, html.dark-mode a.btn:hover span, html.dark-mode a.btn:hover .btn-inner--text, html.dark-mode .btn-default:hover span, html.dark-mode .btn-primary:hover span { background-color: var(--qhali-success) !important; border-color: var(--qhali-success) !important; color: #163058 !important; } html.dark-mode .btn-outline-primary { color: var(--qhali-success) !important; border-color: var(--qhali-success) !important; background-color: transparent !important; } html.dark-mode .btn-outline-primary:hover { background-color: var(--qhali-success) !important; color: #163058 !important; } html.dark-mode .btn-neutral, html.dark-mode .btn.btn-neutral { background-color: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; color: var(--dm-heading) !important; } html.dark-mode header .topWrap .menuTopWrap #mainmenu > li > a { color: var(--dm-text) !important; } html.dark-mode header .topWrap .menuTopWrap #mainmenu > li > a:hover, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li > a:focus { background-color: var(--qhali-secondary) !important; color: #ffffff !important; } html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a:hover, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a:focus, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:hover, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-login-item > a:focus { color: #ffffff !important; } html.dark-mode header .topWrap .menuTopWrap #mainmenu > li.current-menu-item > a { background-color: var(--qhali-primary) !important; } html.dark-mode header .topWrap .menuTopWrap #mainmenu > li ul > li > a, html.dark-mode header .topWrap .menuTopWrap #mainmenu > li ul > li > a:hover { background-color: var(--qhali-secondary) !important; color: #ffffff !important; } html.dark-mode .slide_description .btn.btn-default { box-shadow: 0 4px 14px rgba(0, 0, 0, 0.45); } html.dark-mode .login-card .btn-primary { color: #ffffff !important; } html.dark-mode .login-card .btn-neutral { background-color: var(--dm-surface-2) !important; border-color: var(--dm-border) !important; color: var(--dm-heading) !important; } /* ========== Modo oscuro — footer, contacto, términos, formularios ========== */ html.dark-mode footer, html.dark-mode footer .copyright_area { background-color: #1b1e28 !important; border-top-color: #313747 !important; } html.dark-mode footer .copyright_area, html.dark-mode footer .copyright_area .copyright, html.dark-mode footer .copyright_area .footer_social { color: #d6d9e0 !important; } html.dark-mode footer .copyright_area .footer_social a.button.nav-link.nav-link-icon, html.dark-mode footer .copyright_area .footer_social a.button.nav-link, html.dark-mode footer .copyright_area .footer_social a, html.dark-mode footer .copyright_area .copyright a, html.dark-mode footer .copyright_area a, html.dark-mode .layout_footer a { color: #9fbe61 !important; text-decoration: underline !important; } html.dark-mode footer .copyright_area .footer_social a:hover, html.dark-mode footer .copyright_area .copyright a:hover, html.dark-mode footer .copyright_area a:hover, html.dark-mode .layout_footer a:hover { color: #ffffff !important; } html.dark-mode footer .sc_socials .sc_icon, html.dark-mode footer .sc_socials .sc_icon:before { color: #9fbe61 !important; } html.dark-mode footer .sc_socials .sc_icon:hover, html.dark-mode footer .sc_socials .sc_icon:hover:before { color: #ffffff !important; } html.dark-mode #underheader .contact_area, html.dark-mode .header_style_2 #underheader .contact_area, html.dark-mode .qhali-header-contact .contact_area, html.dark-mode .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area { color: #ffffff !important; } html.dark-mode #underheader .contact_area .text-separator, html.dark-mode .qhali-header-contact .contact_area .text-separator, html.dark-mode .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area .text-separator { color: #c8d4a6 !important; } html.dark-mode #underheader .contact_area [class^="icon-"]:before, html.dark-mode #underheader .contact_area [class*=" icon-"]:before, html.dark-mode .qhali-header-contact .contact_area [class^="icon-"]:before, html.dark-mode .qhali-header-contact .contact_area [class*=" icon-"]:before, html.dark-mode .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area [class^="icon-"]:before, html.dark-mode .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area [class*=" icon-"]:before { color: #c6e07a !important; } html.dark-mode #underheader .contact_area .icon-rounded, html.dark-mode .qhali-header-contact .contact_area .icon-rounded, html.dark-mode .header_style_2 header .topWrap.qhali-header-row .qhali-header-contact .contact_area .icon-rounded { color: #c6e07a !important; background-color: rgba(198, 224, 122, 0.22) !important; } html.dark-mode .custom-control.custom-checkbox label.custom-control-label, html.dark-mode label.custom-control-label[for="privacypolicy"] { color: #d6d9e0 !important; } html.dark-mode .custom-control.custom-checkbox label.custom-control-label a, html.dark-mode label.custom-control-label a[href] { color: #9fbe61 !important; text-decoration: underline !important; } html.dark-mode .custom-control.custom-checkbox label.custom-control-label a:hover, html.dark-mode label.custom-control-label a[href]:hover { color: #ffffff !important; } html.dark-mode .light_section .post_descr p, html.dark-mode .light_section .post_descr span, html.dark-mode .post_descr p[style], html.dark-mode .post_descr span[style] { color: #d6d9e0 !important; } html.dark-mode .form-control, html.dark-mode .form-control-alternative, html.dark-mode input.form-control, html.dark-mode input.form-control-alternative, html.dark-mode select.form-control, html.dark-mode textarea.form-control { background-color: #1e222d !important; border-color: #313747 !important; color: #d6d9e0 !important; } html.dark-mode .form-control::placeholder, html.dark-mode input::placeholder, html.dark-mode textarea::placeholder { color: #99a0af !important; } html.dark-mode .form-control-label, html.dark-mode label.form-control-label { color: #d6d9e0 !important; } html.dark-mode .slide_description .slide_title.text-primary { color: #9fbe61 !important; } /* Cartillas de profesionales de salud */ .qhali-pro-grid { display: flex; flex-wrap: wrap; } .qhali-pro-grid > [class*="col-"] { display: flex; margin-bottom: 24px; } .qhali-pro-card { width: 100%; display: flex; flex-direction: column; border: 1px solid #e0e0e0; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06); background: #fff; } .qhali-pro-card .panel-body { display: flex; flex-direction: column; flex: 1 1 auto; padding: 20px; text-align: center; } .qhali-pro-photo { width: 96px; height: 96px; margin: 0 auto 14px; border-radius: 50%; overflow: hidden; background: #e8edf3; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .qhali-pro-photo img { width: 100%; height: 100%; object-fit: cover; } .qhali-pro-photo-lg { width: 140px; height: 140px; } .qhali-pro-photo-edit { width: 88px; height: 88px; margin: 0; } .qhali-pro-initials { font-size: 28px; font-weight: 700; color: #163058; line-height: 1; } .qhali-pro-photo-lg .qhali-pro-initials { font-size: 40px; } .qhali-pro-name { margin: 0 0 4px; font-size: 18px; line-height: 1.3; min-height: 2.6em; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .qhali-pro-type { margin: 0 0 8px; font-size: 13px; color: #6c757d; } .qhali-pro-specialties { flex: 1 1 auto; min-height: 3.6em; max-height: 3.6em; margin: 0 0 8px; font-size: 13px; line-height: 1.2; color: #555; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .qhali-pro-city { margin: 0 0 14px; font-size: 13px; color: #444; } .qhali-pro-actions { margin-top: auto; } .qhali-book-panel .qhali-pro-photo { margin-bottom: 16px; } #health_professional_section { padding: 40px 0 50px; } #health_professional_section .qhali-health-banner { display: block; width: 100%; height: auto; border-radius: 10px; box-shadow: 0 8px 24px rgba(22, 48, 88, 0.12); } #slider-2.flexslider .slides > li > img { width: 100%; height: auto; aspect-ratio: 1920 / 750; object-fit: cover; object-position: center center; } #eliminate_section.sc_parallax .sc_parallax_content { background-repeat: no-repeat !important; background-size: cover !important; background-position: center 40% !important; position: relative; } #eliminate_section.sc_parallax .sc_parallax_content::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(22, 48, 88, 0.72) 0%, rgba(22, 48, 88, 0.38) 48%, rgba(22, 48, 88, 0.16) 100%); pointer-events: none; } #eliminate_section .container { position: relative; z-index: 1; }