/* ============================================================ SOLICITUD CAMPAÑAS - CSS AISLADO PARA KAAVAN Namespace: #cct-solicitud-campanas Todos los estilos con !important para sobrescribir el CMS ============================================================ */ @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap'); /* --- Reset base dentro del namespace --- */ #cct-solicitud-campanas *, #cct-solicitud-campanas *::before, #cct-solicitud-campanas *::after { box-sizing: border-box !important; font-family: 'Inter', sans-serif !important; } /* --- Contenedor raíz --- */ #cct-solicitud-campanas { background-color: #f7f9fb !important; color: #191c1e !important; min-height: 60vh !important; width: 100% !important; } /* --- Header interno (barra naranja de título) --- */ #cct-solicitud-campanas .scc-header { background-color: #041627 !important; padding: 1rem 1.5rem !important; display: flex !important; align-items: center !important; justify-content: center !important; margin-bottom: 2rem !important; } #cct-solicitud-campanas .scc-header-title { color: #ffffff !important; font-size: 18px !important; font-weight: 700 !important; line-height: 24px !important; margin: 0 !important; } /* --- Main wrapper --- */ #cct-solicitud-campanas .scc-main { padding: 1.5rem !important; max-width: 1200px !important; margin: 0 auto !important; width: 100% !important; } /* --- Título principal --- */ #cct-solicitud-campanas .scc-page-title { font-size: 32px !important; line-height: 40px !important; font-weight: 700 !important; letter-spacing: -0.02em !important; color: #041627 !important; margin-bottom: 0.5rem !important; margin-top: 0 !important; text-align: center !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-page-title { text-align: left !important; } } #cct-solicitud-campanas .scc-page-subtitle { font-size: 16px !important; line-height: 24px !important; font-weight: 400 !important; color: #44474c !important; margin-bottom: 2rem !important; text-align: center !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-page-subtitle { text-align: left !important; } } /* --- Sección de departamentos --- */ #cct-solicitud-campanas .scc-section-title { font-size: 18px !important; font-weight: 600 !important; line-height: 24px !important; color: #041627 !important; margin-bottom: 1rem !important; text-align: center !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-section-title { text-align: left !important; } } /* --- Grid de departamentos --- */ #cct-solicitud-campanas .scc-dept-grid { display: grid !important; grid-template-columns: repeat(2, 1fr) !important; gap: 1rem !important; margin-bottom: 2rem !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-dept-grid { grid-template-columns: repeat(3, 1fr) !important; } } @media (min-width: 1024px) { #cct-solicitud-campanas .scc-dept-grid { grid-template-columns: repeat(6, 1fr) !important; } } /* --- Tarjeta de departamento --- */ #cct-solicitud-campanas .scc-dept-card { padding: 1rem !important; display: flex !important; flex-direction: column !important; align-items: center !important; justify-content: center !important; gap: 0.5rem !important; background-color: #ffffff !important; border: 2px solid #c4c6cd !important; border-radius: 0.5rem !important; cursor: pointer !important; transition: border-color 0.2s, box-shadow 0.2s !important; text-decoration: none !important; appearance: none !important; -webkit-appearance: none !important; width: 100% !important; } #cct-solicitud-campanas .scc-dept-card:hover { border-color: #f97316 !important; } #cct-solicitud-campanas .scc-dept-card.active { border-color: #f97316 !important; background-color: #ffffff !important; box-shadow: 0 4px 12px rgba(249, 115, 22, 0.15) !important; } /* --- Icono de tarjeta --- */ #cct-solicitud-campanas .scc-dept-icon { width: 3rem !important; height: 3rem !important; border-radius: 9999px !important; background-color: #eceef0 !important; color: #041627 !important; display: flex !important; align-items: center !important; justify-content: center !important; transition: background-color 0.2s, color 0.2s !important; } #cct-solicitud-campanas .scc-dept-card:hover .scc-dept-icon, #cct-solicitud-campanas .scc-dept-card.active .scc-dept-icon { background-color: #f97316 !important; color: #ffffff !important; } #cct-solicitud-campanas .scc-dept-icon .material-symbols-outlined { font-size: 1.5rem !important; font-family: 'Material Symbols Outlined' !important; } /* --- Label de tarjeta --- */ #cct-solicitud-campanas .scc-dept-label { font-size: 12px !important; line-height: 16px !important; letter-spacing: 0.05em !important; font-weight: 700 !important; color: #191c1e !important; text-transform: uppercase !important; margin: 0 !important; } /* --- Formularios (secciones) --- */ #cct-solicitud-campanas .scc-form-section { max-width: 896px !important; margin: 0 auto 2rem auto !important; } #cct-solicitud-campanas .scc-form-section.hidden { display: none !important; } #cct-solicitud-campanas .scc-form-card { background-color: #ffffff !important; border-radius: 0.75rem !important; box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important; border: 1px solid #c4c6cd !important; padding: 1.5rem !important; } @media (min-width: 1024px) { #cct-solicitud-campanas .scc-form-card { padding: 2rem !important; } } /* --- Animación de aparición --- */ #cct-solicitud-campanas .scc-form-transition { transition: opacity 0.5s ease-out, transform 0.5s ease-out !important; opacity: 0 !important; transform: translateY(10px) !important; } #cct-solicitud-campanas .scc-form-transition.show { opacity: 1 !important; transform: translateY(0) !important; } /* --- Títulos de formulario --- */ #cct-solicitud-campanas .scc-form-title { font-size: 24px !important; line-height: 32px !important; font-weight: 600 !important; color: #041627 !important; margin-bottom: 1.5rem !important; margin-top: 0 !important; } /* --- Espaciado entre campos --- */ #cct-solicitud-campanas .scc-field-group { margin-bottom: 1.5rem !important; } /* --- Labels --- */ #cct-solicitud-campanas .scc-label { display: block !important; font-size: 12px !important; line-height: 16px !important; letter-spacing: 0.05em !important; font-weight: 700 !important; color: #191c1e !important; margin-bottom: 0.5rem !important; text-transform: uppercase !important; } /* --- Inputs, selects, textareas --- */ #cct-solicitud-campanas input[type="text"], #cct-solicitud-campanas input[type="email"], #cct-solicitud-campanas select, #cct-solicitud-campanas textarea { width: 100% !important; background-color: #f7f9fb !important; border: 1px solid #74777d !important; border-radius: 0.5rem !important; padding: 0.5rem 1rem !important; font-size: 14px !important; line-height: 20px !important; color: #191c1e !important; outline: none !important; box-shadow: none !important; appearance: none !important; -webkit-appearance: none !important; transition: border-color 0.2s, box-shadow 0.2s !important; } #cct-solicitud-campanas input[type="text"]:focus, #cct-solicitud-campanas input[type="email"]:focus, #cct-solicitud-campanas select:focus, #cct-solicitud-campanas textarea:focus { border-color: #f97316 !important; box-shadow: 0 0 0 2px rgba(249, 115, 22, 0.3) !important; } #cct-solicitud-campanas select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2344474c' d='M6 8L1 3h10z'/%3E%3C/svg%3E") !important; background-repeat: no-repeat !important; background-position: right 0.75rem center !important; padding-right: 2rem !important; } #cct-solicitud-campanas textarea { resize: vertical !important; min-height: 80px !important; } /* --- Texto de ayuda bajo campos --- */ #cct-solicitud-campanas .scc-field-hint { font-size: 12px !important; color: #44474c !important; margin-top: 0.25rem !important; margin-bottom: 0 !important; } /* --- Grid 2 columnas en formulario --- */ #cct-solicitud-campanas .scc-grid-2 { display: grid !important; grid-template-columns: 1fr !important; gap: 1.5rem !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-grid-2 { grid-template-columns: repeat(2, 1fr) !important; } } /* --- Separador de secciones --- */ #cct-solicitud-campanas .scc-divider { border-top: 1px solid #c4c6cd !important; padding-top: 1.5rem !important; margin-top: 0 !important; } /* --- Upload area --- */ #cct-solicitud-campanas .scc-upload-area { display: flex !important; justify-content: center !important; padding: 1.5rem !important; border: 2px dashed #c4c6cd !important; border-radius: 0.5rem !important; transition: border-color 0.2s !important; cursor: pointer !important; } #cct-solicitud-campanas .scc-upload-area:hover { border-color: #f97316 !important; } #cct-solicitud-campanas .scc-upload-inner { text-align: center !important; } #cct-solicitud-campanas .scc-upload-icon { font-size: 2.5rem !important; color: #44474c !important; display: block !important; margin-bottom: 0.5rem !important; font-family: 'Material Symbols Outlined' !important; } #cct-solicitud-campanas .scc-upload-label { font-size: 14px !important; color: #44474c !important; display: flex !important; align-items: center !important; justify-content: center !important; gap: 0.25rem !important; } #cct-solicitud-campanas .scc-upload-trigger { color: #f97316 !important; font-weight: 600 !important; cursor: pointer !important; background: none !important; border: none !important; padding: 0 !important; text-decoration: underline !important; } #cct-solicitud-campanas .scc-upload-hint { font-size: 12px !important; color: #44474c !important; margin-top: 0.25rem !important; } /* --- Botón de envío --- */ #cct-solicitud-campanas .scc-submit-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 0.5rem !important; background-color: #f97316 !important; color: #ffffff !important; padding: 0.75rem 2rem !important; border-radius: 0.5rem !important; font-weight: 700 !important; font-size: 14px !important; border: none !important; cursor: pointer !important; box-shadow: 0 4px 12px rgba(249, 115, 22, 0.35) !important; transition: filter 0.2s, transform 0.1s !important; width: 100% !important; text-decoration: none !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-submit-btn { width: auto !important; } } #cct-solicitud-campanas .scc-submit-btn:hover { filter: brightness(1.1) !important; } #cct-solicitud-campanas .scc-submit-btn:active { transform: scale(0.97) !important; } #cct-solicitud-campanas .scc-submit-btn .material-symbols-outlined { font-size: 1.2rem !important; font-family: 'Material Symbols Outlined' !important; } #cct-solicitud-campanas .scc-submit-row { display: flex !important; justify-content: center !important; padding-top: 1rem !important; margin-top: 1.5rem !important; } /* --- Overlay de éxito --- */ #cct-solicitud-campanas .scc-success-overlay { position: fixed !important; inset: 0 !important; z-index: 9999 !important; background: rgba(4, 22, 39, 0.95) !important; backdrop-filter: blur(8px) !important; display: flex !important; align-items: center !important; justify-content: center !important; } #cct-solicitud-campanas .scc-success-overlay.hidden { display: none !important; } #cct-solicitud-campanas .scc-success-box { background-color: #ffffff !important; padding: 2rem !important; border-radius: 0.75rem !important; box-shadow: 0 20px 60px rgba(0,0,0,0.4) !important; max-width: 380px !important; width: 90% !important; text-align: center !important; transform: scale(0.9) !important; opacity: 0 !important; transition: transform 0.5s, opacity 0.5s !important; } #cct-solicitud-campanas .scc-success-box.show { transform: scale(1) !important; opacity: 1 !important; } #cct-solicitud-campanas .scc-success-icon-wrap { width: 5rem !important; height: 5rem !important; background-color: rgba(249, 115, 22, 0.1) !important; color: #f97316 !important; border-radius: 9999px !important; display: flex !important; align-items: center !important; justify-content: center !important; margin: 0 auto 1.5rem auto !important; } #cct-solicitud-campanas .scc-success-icon-wrap .material-symbols-outlined { font-size: 3rem !important; font-family: 'Material Symbols Outlined' !important; } #cct-solicitud-campanas .scc-success-title { font-size: 24px !important; font-weight: 600 !important; color: #041627 !important; margin-bottom: 0.5rem !important; margin-top: 0 !important; } #cct-solicitud-campanas .scc-success-msg { font-size: 14px !important; color: #44474c !important; margin-bottom: 1.5rem !important; } #cct-solicitud-campanas .scc-success-back-btn { width: 100% !important; background-color: #041627 !important; color: #ffffff !important; padding: 0.75rem 1rem !important; border-radius: 0.5rem !important; font-weight: 700 !important; border: none !important; cursor: pointer !important; transition: background-color 0.2s !important; font-size: 14px !important; } #cct-solicitud-campanas .scc-success-back-btn:hover { background-color: #1a2b3c !important; } /* --- Footer interno --- */ #cct-solicitud-campanas .scc-footer { padding: 1.5rem !important; display: flex !important; flex-direction: column !important; align-items: center !important; gap: 0.5rem !important; background-color: #f2f4f6 !important; border-top: 1px solid #c4c6cd !important; color: #44474c !important; margin-top: 2rem !important; } @media (min-width: 768px) { #cct-solicitud-campanas .scc-footer { flex-direction: row !important; justify-content: space-between !important; } } #cct-solicitud-campanas .scc-footer-copy { font-size: 12px !important; font-weight: 700 !important; margin: 0 !important; } #cct-solicitud-campanas .scc-footer-links { display: flex !important; gap: 1.5rem !important; } #cct-solicitud-campanas .scc-footer-links a { font-size: 12px !important; font-weight: 500 !important; color: #44474c !important; text-decoration: none !important; transition: color 0.2s !important; } #cct-solicitud-campanas .scc-footer-links a:hover { color: #041627 !important; } /* --- Utilidades --- */ #cct-solicitud-campanas .hidden { display: none !important; } #cct-solicitud-campanas .scc-mb-section { margin-bottom: 2rem !important; }

Search

Solicitud de Campañas - Grupo Concesur
Grupo Concesur

Solicitud de Campañas Publicitarias

Gestión centralizada de marketing para departamentos del Grupo Concesur.

Seleccione el Departamento