/* Maintenance Mode admin styles */ .kng-maintenance-tabs .ka-tab { display: inline-flex; align-items: center; gap: 6px; text-decoration: none; } .ka-status-warning { background: rgba(255, 159, 10, 0.15); color: #ff9f0a; } .kng-maintenance-dashboard-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px; margin-top: 24px; } .kng-maintenance-stat-row { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-radius: 12px; background: rgba(0, 0, 0, 0.04); margin-bottom: 10px; } .kng-maintenance-schedule-preview { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 16px; } .kng-maintenance-source-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; } .kng-maintenance-radio { display: flex; flex-direction: column; gap: 8px; padding: 14px; border-radius: 14px; border: 1px solid rgba(0, 0, 0, 0.08); background: #fff; cursor: pointer; } .kng-maintenance-radio input { margin-right: 8px; } .kng-maintenance-radio.is-disabled { opacity: 0.6; pointer-events: none; } .kng-maintenance-template-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 18px; } .kng-maintenance-template-card { display: flex; flex-direction: column; gap: 10px; padding: 14px; border-radius: 16px; border: 1px solid rgba(0, 0, 0, 0.08); background: #fff; cursor: pointer; transition: transform 0.2s ease, box-shadow 0.2s ease; position: relative; } .kng-maintenance-template-card.is-locked { opacity: 0.6; cursor: not-allowed; } .kng-maintenance-template-card .ka-pro-badge { position: absolute; top: 12px; right: 12px; } .kng-maintenance-template-card input { margin-bottom: 6px; } .kng-maintenance-template-card:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08); } .kng-maintenance-template-preview { border-radius: 14px; padding: 16px; background: linear-gradient(135deg, rgba(0, 113, 227, 0.12), rgba(16, 185, 129, 0.12)); display: grid; gap: 8px; } .kng-maintenance-template-preview .kng-template-line { height: 8px; border-radius: 999px; background: rgba(0, 0, 0, 0.2); } .kng-maintenance-template-dark { background: linear-gradient(135deg, rgba(15, 15, 18, 0.9), rgba(0, 0, 0, 0.7)); } .kng-maintenance-template-gradient { background: linear-gradient(135deg, rgba(96, 165, 250, 0.3), rgba(236, 72, 153, 0.25)); } .kng-maintenance-template-aurora { background: radial-gradient(circle at 20% 20%, rgba(56, 189, 248, 0.28), transparent 55%), radial-gradient(circle at 80% 30%, rgba(34, 197, 94, 0.22), transparent 55%), radial-gradient(circle at 50% 80%, rgba(236, 72, 153, 0.22), transparent 60%), linear-gradient(135deg, rgba(15, 15, 18, 0.95), rgba(0, 0, 0, 0.75)); } .kng-maintenance-template-neon { background: linear-gradient(135deg, rgba(34, 211, 238, 0.22), rgba(168, 85, 247, 0.2)), linear-gradient(135deg, rgba(10, 10, 12, 0.95), rgba(0, 0, 0, 0.8)); } .kng-maintenance-template-paper { background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(226, 232, 240, 0.75)); } .kng-maintenance-template-mono { background: linear-gradient(135deg, rgba(148, 163, 184, 0.2), rgba(15, 15, 18, 0.15)); } .kng-maintenance-template-spotlight { background: radial-gradient(circle at 50% 10%, rgba(59, 130, 246, 0.32), transparent 55%), linear-gradient(135deg, rgba(15, 15, 18, 0.95), rgba(0, 0, 0, 0.75)); } .kng-maintenance-template-poster { background: linear-gradient(135deg, rgba(236, 72, 153, 0.22), rgba(59, 130, 246, 0.2)), linear-gradient(135deg, rgba(15, 15, 18, 0.95), rgba(0, 0, 0, 0.75)); } .kng-maintenance-template-ribbon { background: linear-gradient(90deg, rgba(34, 197, 94, 0.22), rgba(0, 113, 227, 0.18), rgba(236, 72, 153, 0.18)); } .kng-maintenance-template-countdown { background: linear-gradient(135deg, rgba(125, 211, 252, 0.2), rgba(34, 197, 94, 0.2)); } .kng-maintenance-template-progress { background: linear-gradient(135deg, rgba(167, 139, 250, 0.25), rgba(59, 130, 246, 0.25)); } .kng-maintenance-template-subscribe { background: linear-gradient(135deg, rgba(251, 146, 60, 0.25), rgba(59, 130, 246, 0.2)); } .kng-maintenance-template-product-launch { background: linear-gradient(135deg, rgba(236, 72, 153, 0.2), rgba(14, 116, 144, 0.2)); } .kng-maintenance-template-construction { background: repeating-linear-gradient(45deg, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05) 10px, rgba(0, 0, 0, 0.12) 10px, rgba(0, 0, 0, 0.12) 20px); } .kng-maintenance-template-split { background: linear-gradient(135deg, rgba(100, 116, 139, 0.2), rgba(59, 130, 246, 0.15)); } .kng-maintenance-template-logo { background: linear-gradient(135deg, rgba(59, 130, 246, 0.15), rgba(0, 0, 0, 0.05)); } .kng-maintenance-section { display: none; } .kng-maintenance-section.is-active { display: block; } .kng-maintenance-content-block { display: none; border-radius: 16px; padding: 16px; border: 1px solid rgba(0, 0, 0, 0.08); background: rgba(0, 0, 0, 0.02); margin-bottom: 16px; } .kng-maintenance-content-block.is-active { display: block; } .kng-maintenance-content-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; margin-bottom: 14px; } .kng-maintenance-content-grid-sm { grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); } /* ===== Private Access (Mode Settings) ===== */ .kng-maintenance-inline-actions { margin-top: 12px; display: grid; gap: 8px; } .kng-maintenance-inline-alert { margin-bottom: 12px; } .kng-maintenance-token-input { width: 100%; max-width: 640px; } .kng-maintenance-token-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; } .kng-maintenance-token-row .kng-maintenance-token-input { flex: 1; min-width: 260px; } .kng-maintenance-copy-status { display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 999px; font-size: 12px; background: rgba(0, 113, 227, 0.12); color: #0071e3; opacity: 0; transform: translateY(-2px); transition: opacity 0.18s ease, transform 0.18s ease; } .kng-maintenance-copy-status.is-visible { opacity: 1; transform: translateY(0); } body.ka-admin-v3.ka-v3-dark .kng-maintenance-copy-status { background: rgba(0, 113, 227, 0.22); color: #a5d8ff; } .kng-maintenance-token-actions { margin-top: 10px; display: flex; gap: 10px; flex-wrap: wrap; } .kng-maintenance-password-actions { margin-top: 12px; } /* Red-tinted secondary button for destructive actions (keeps the global ka-btn shape). */ .ka-btn.kng-maintenance-btn-danger { background: rgba(239, 68, 68, 0.12); color: #b91c1c; } .ka-btn.kng-maintenance-btn-danger:hover { background: rgba(239, 68, 68, 0.18); color: #991b1b; } body.ka-admin-v3.ka-v3-dark .ka-btn.kng-maintenance-btn-danger { background: rgba(239, 68, 68, 0.18); color: #fecaca; } body.ka-admin-v3.ka-v3-dark .ka-btn.kng-maintenance-btn-danger:hover { background: rgba(239, 68, 68, 0.24); color: #fee2e2; } .kng-maintenance-note { font-size: 13px; color: #6e6e73; margin-top: 8px; } /* ===== FIELD CONTROLS (used in Page Builder / Rules / Schedule) ===== */ .kng-maintenance-admin .kng-field { display: flex; flex-direction: column; gap: 8px; } .kng-maintenance-admin .kng-field label { font-size: 12px; font-weight: 600; color: #1d1d1f; } .kng-maintenance-admin .kng-field input[type="text"], .kng-maintenance-admin .kng-field input[type="number"], .kng-maintenance-admin .kng-field input[type="password"], .kng-maintenance-admin .kng-field input[type="email"], .kng-maintenance-admin .kng-field input[type="date"], .kng-maintenance-admin .kng-field input[type="datetime-local"], .kng-maintenance-admin .kng-field input[type="time"], .kng-maintenance-admin .kng-field select, .kng-maintenance-admin .kng-field textarea, .kng-maintenance-admin .ka-card-body > select { width: 100%; max-width: 400px; padding: 12px 16px; border: 1px solid rgba(0, 0, 0, 0.1); border-radius: 12px; font-size: 15px; font-family: inherit; background-color: #fff; transition: border-color 0.2s, box-shadow 0.2s; } .kng-maintenance-admin .kng-field input[type="text"]:focus, .kng-maintenance-admin .kng-field input[type="number"]:focus, .kng-maintenance-admin .kng-field input[type="password"]:focus, .kng-maintenance-admin .kng-field input[type="email"]:focus, .kng-maintenance-admin .kng-field input[type="date"]:focus, .kng-maintenance-admin .kng-field input[type="datetime-local"]:focus, .kng-maintenance-admin .kng-field input[type="time"]:focus, .kng-maintenance-admin .kng-field textarea:focus, .kng-maintenance-admin .kng-field select:focus, .kng-maintenance-admin .ka-card-body > select:focus { outline: none; border-color: rgba(0, 113, 227, 0.55); box-shadow: 0 0 0 3px rgba(0, 113, 227, 0.18); } /* Dropdown arrow for selects not wrapped in .ka-row-field */ .kng-maintenance-admin .kng-field select:not([multiple]), .kng-maintenance-admin .ka-card-body > select:not([multiple]) { padding-right: 48px; cursor: pointer; -webkit-appearance: none; -moz-appearance: none; appearance: none; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231d1d1f' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 16px center; background-size: 18px 18px; } body.ka-v3-dark .kng-maintenance-admin .kng-field label { color: #f5f5f7; } body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="text"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="number"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="password"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="email"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="date"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="datetime-local"], body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="time"], body.ka-v3-dark .kng-maintenance-admin .kng-field select, body.ka-v3-dark .kng-maintenance-admin .kng-field textarea, body.ka-v3-dark .kng-maintenance-admin .ka-card-body > select { background-color: #2c2c2e; border-color: rgba(255, 255, 255, 0.1); color: #f5f5f7; } body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="text"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="number"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="password"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="email"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="date"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="datetime-local"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field input[type="time"]:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field textarea:focus, body.ka-v3-dark .kng-maintenance-admin .kng-field select:focus, body.ka-v3-dark .kng-maintenance-admin .ka-card-body > select:focus { outline: none; border-color: rgba(0, 113, 227, 0.75); box-shadow: 0 0 0 3px rgba(0, 113, 227, 0.28); } body.ka-v3-dark .kng-maintenance-admin .kng-field select:not([multiple]), body.ka-v3-dark .kng-maintenance-admin .ka-card-body > select:not([multiple]) { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%23f5f5f7' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); } .kng-maintenance-actions { margin-top: 12px; } .kng-maintenance-rule-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; margin-top: 16px; } .kng-maintenance-pro-grid { display: grid; gap: 12px; margin-bottom: 16px; } .kng-maintenance-schedule-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; margin-top: 12px; } .kng-maintenance-analytics-placeholder { display: grid; gap: 12px; margin-bottom: 16px; } .kng-maintenance-repeat { display: grid; gap: 14px; } .kng-repeat-row { border-radius: 16px; padding: 14px; border: 1px solid rgba(0, 0, 0, 0.08); background: rgba(0, 0, 0, 0.02); } .kng-repeat-actions { display: flex; justify-content: flex-end; margin-top: 10px; } body.ka-v3-dark .kng-maintenance-stat-row, body.ka-v3-dark .kng-maintenance-radio, body.ka-v3-dark .kng-maintenance-template-card, body.ka-v3-dark .kng-maintenance-content-block { background: #0f0f12; border-color: rgba(255, 255, 255, 0.08); color: #f5f5f7; } body.ka-v3-dark .kng-maintenance-template-preview .kng-template-line { background: rgba(255, 255, 255, 0.2); } body.ka-v3-dark .kng-maintenance-note { color: #a1a1a6; } @media (max-width: 1200px) { .kng-maintenance-dashboard-grid { grid-template-columns: 1fr; } } .kng-maintenance-admin .ka-stat-value { font-size: 26px; }