/* Sky Blue Theme - Alternative Design */

:root.theme-skyblue {
    --primary: #00b4d8;
    --secondary: #0096c7;
    --dark: #023e8a;
    --darker: #03045e;
    --light: #ffffff;
    --text-light: #caf0f8;
    --success: #06d6a0;
    --gradient-1: linear-gradient(135deg, #00b4d8 0%, #0077b6 100%);
    --gradient-2: linear-gradient(135deg, #48cae4 0%, #00b4d8 100%);
    --gradient-3: linear-gradient(135deg, #90e0ef 0%, #00b4d8 100%);
}

.theme-skyblue body {
    background: linear-gradient(135deg, #03045e 0%, #023e8a 50%, #0077b6 100%);
    background-attachment: fixed;
}

/* Navbar */
.theme-skyblue .navbar {
    background: rgba(3, 4, 94, 0.95);
    border-bottom: 1px solid rgba(0, 180, 216, 0.3);
}

.theme-skyblue .logo {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    text-shadow: 0 0 30px rgba(0, 180, 216, 0.5);
}

.theme-skyblue .hamburger span {
    background: #caf0f8;
}

.theme-skyblue .nav-menu {
    background: #03045e;
}

.theme-skyblue .nav-menu a:hover {
    background: rgba(0, 180, 216, 0.1);
}

/* Hero */
.theme-skyblue .hero {
    background: linear-gradient(135deg, rgba(3, 4, 94, 0.9) 0%, rgba(2, 62, 138, 0.9) 100%);
}

.theme-skyblue .hero::before {
    background: radial-gradient(circle at 50% 50%, rgba(0, 180, 216, 0.15) 0%, transparent 70%);
}

.theme-skyblue .hero h1 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 50%, #90e0ef 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .hero p {
    color: #caf0f8;
}

/* Buttons */
.theme-skyblue .btn-primary {
    background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
    box-shadow: 0 8px 25px rgba(0, 180, 216, 0.4);
}

.theme-skyblue .btn-primary:hover {
    box-shadow: 0 12px 35px rgba(0, 180, 216, 0.6);
    background: linear-gradient(135deg, #0096c7 0%, #0077b6 100%);
}

.theme-skyblue .btn-secondary {
    color: #00b4d8;
    border-color: #00b4d8;
}

.theme-skyblue .btn-secondary:hover {
    background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
}

/* Sections */
.theme-skyblue section h2 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue section h2::after {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
}

/* Plan Cards */
.theme-skyblue .plan-card {
    background: rgba(3, 4, 94, 0.8);
    border: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .plan-card::before {
    background: linear-gradient(90deg, #00b4d8 0%, #48cae4 100%);
}

.theme-skyblue .plan-card:hover {
    box-shadow: 0 15px 45px rgba(0, 180, 216, 0.3);
    border-color: rgba(0, 180, 216, 0.5);
}

.theme-skyblue .plan-card.featured {
    border-color: #00b4d8;
    background: rgba(0, 180, 216, 0.05);
    box-shadow: 0 10px 40px rgba(0, 180, 216, 0.4);
}

.theme-skyblue .plan-card.featured::after {
    background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
}

.theme-skyblue .price {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .price span {
    color: #caf0f8;
}

.theme-skyblue .plan-card li {
    color: #caf0f8;
}

.theme-skyblue .plan-card li::before {
    color: #06d6a0;
}

/* Gallery */
.theme-skyblue .gallery-item {
    background: linear-gradient(135deg, rgba(0, 180, 216, 0.1) 0%, rgba(0, 150, 199, 0.1) 100%);
    border: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .gallery-item:hover {
    border-color: rgba(0, 180, 216, 0.5);
}

/* Help Cards */
.theme-skyblue .help-card {
    background: rgba(3, 4, 94, 0.8);
    border: 2px solid rgba(0, 180, 216, 0.1);
}

.theme-skyblue .help-card:hover {
    border-color: rgba(0, 180, 216, 0.3);
}

.theme-skyblue .help-card h3 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .help-card p {
    color: #caf0f8;
}

/* Auth Pages */
.theme-skyblue .auth-container {
    background: linear-gradient(135deg, #03045e 0%, #023e8a 50%, #0077b6 100%);
}

.theme-skyblue .auth-box {
    background: rgba(3, 4, 94, 0.9);
    border: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .auth-box h2 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .form-group label {
    color: #caf0f8;
}

.theme-skyblue .form-group input,
.theme-skyblue .form-group select {
    border: 2px solid rgba(0, 180, 216, 0.2);
    background: rgba(2, 62, 138, 0.8);
    color: #ffffff;
}

.theme-skyblue .form-group input:focus,
.theme-skyblue .form-group select:focus {
    border-color: #00b4d8;
    background: rgba(2, 62, 138, 1);
    box-shadow: 0 0 20px rgba(0, 180, 216, 0.2);
}

.theme-skyblue .auth-link {
    color: #caf0f8;
}

.theme-skyblue .auth-link a {
    color: #00b4d8;
}

.theme-skyblue .auth-link a:hover {
    color: #48cae4;
}

/* Dashboard */
.theme-skyblue .dashboard-header h1 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .stat-card {
    background: rgba(3, 4, 94, 0.8);
    border: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .stat-card::before {
    background: linear-gradient(90deg, #00b4d8 0%, #48cae4 100%);
}

.theme-skyblue .stat-card::after {
    background: radial-gradient(circle, rgba(0, 180, 216, 0.1) 0%, transparent 70%);
}

.theme-skyblue .stat-card:hover {
    box-shadow: 0 20px 60px rgba(0, 180, 216, 0.4);
    border-color: rgba(0, 180, 216, 0.6);
}

.theme-skyblue .stat-icon {
    background: linear-gradient(135deg, rgba(0, 180, 216, 0.2) 0%, rgba(0, 150, 199, 0.2) 100%);
    border: 2px solid rgba(0, 180, 216, 0.3);
}

.theme-skyblue .stat-card:hover .stat-icon {
    background: linear-gradient(135deg, rgba(0, 180, 216, 0.4) 0%, rgba(0, 150, 199, 0.4) 100%);
    box-shadow: 0 10px 30px rgba(0, 180, 216, 0.5);
}

.theme-skyblue .stat-info h3 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue .stat-info p {
    color: #90e0ef;
}

.theme-skyblue .stat-card:hover .stat-info p {
    color: #caf0f8;
}

/* Specific card colors for sky blue theme */
.theme-skyblue .stat-card.members .stat-icon {
    background: linear-gradient(135deg, rgba(72, 202, 228, 0.2) 0%, rgba(0, 180, 216, 0.2) 100%);
    border-color: rgba(72, 202, 228, 0.3);
}

.theme-skyblue .stat-card.members:hover .stat-icon {
    background: linear-gradient(135deg, rgba(72, 202, 228, 0.4) 0%, rgba(0, 180, 216, 0.4) 100%);
}

.theme-skyblue .stat-card.revenue .stat-icon {
    background: linear-gradient(135deg, rgba(6, 214, 160, 0.2) 0%, rgba(5, 150, 105, 0.2) 100%);
    border-color: rgba(6, 214, 160, 0.3);
}

.theme-skyblue .stat-card.revenue:hover .stat-icon {
    background: linear-gradient(135deg, rgba(6, 214, 160, 0.4) 0%, rgba(5, 150, 105, 0.4) 100%);
}

.theme-skyblue .stat-card.bookings .stat-icon {
    background: linear-gradient(135deg, rgba(144, 224, 239, 0.2) 0%, rgba(0, 180, 216, 0.2) 100%);
    border-color: rgba(144, 224, 239, 0.3);
}

.theme-skyblue .stat-card.bookings:hover .stat-icon {
    background: linear-gradient(135deg, rgba(144, 224, 239, 0.4) 0%, rgba(0, 180, 216, 0.4) 100%);
}

/* Table */
.theme-skyblue .table-container {
    background: rgba(3, 4, 94, 0.8);
    border: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .table-container h2 {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue th, 
.theme-skyblue td {
    border-bottom: 1px solid rgba(0, 180, 216, 0.1);
}

.theme-skyblue th {
    background: linear-gradient(135deg, #00b4d8 0%, #48cae4 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.theme-skyblue td {
    color: #caf0f8;
}

.theme-skyblue tr:hover {
    background: rgba(0, 180, 216, 0.05);
}

/* Sidebar */
.theme-skyblue .sidebar-menu {
    background: #03045e;
}

.theme-skyblue .sidebar-header {
    background: #020338;
    border-bottom: 1px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue .sidebar-header h2 {
    color: #caf0f8;
}

.theme-skyblue .close-sidebar:hover {
    color: #00b4d8;
}

.theme-skyblue .sidebar-nav a {
    color: #90e0ef;
}

.theme-skyblue .sidebar-nav a:hover {
    background: rgba(0, 180, 216, 0.05);
    color: #caf0f8;
    border-left-color: #00b4d8;
}

.theme-skyblue .sidebar-nav a.active {
    background: rgba(0, 180, 216, 0.1);
    color: #00b4d8;
    border-left-color: #00b4d8;
}

.theme-skyblue .menu-btn {
    background: #00b4d8;
    box-shadow: 0 4px 15px rgba(0, 180, 216, 0.4);
}

.theme-skyblue .menu-btn:hover {
    background: #0096c7;
    box-shadow: 0 6px 20px rgba(0, 180, 216, 0.6);
}

/* WhatsApp Float */
.theme-skyblue .whatsapp-float {
    background: linear-gradient(135deg, #06d6a0 0%, #05a677 100%);
    box-shadow: 0 8px 25px rgba(6, 214, 160, 0.5);
}

.theme-skyblue .whatsapp-float:hover {
    box-shadow: 0 12px 35px rgba(6, 214, 160, 0.7);
}

/* Footer */
.theme-skyblue footer {
    background: rgba(3, 4, 94, 0.95);
    border-top: 2px solid rgba(0, 180, 216, 0.2);
}

.theme-skyblue footer p {
    color: #caf0f8;
}

/* Scrollbar */
.theme-skyblue ::-webkit-scrollbar-track {
    background: #03045e;
}

.theme-skyblue ::-webkit-scrollbar-thumb {
    background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
}

.theme-skyblue ::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(135deg, #0096c7 0%, #0077b6 100%);
}

/* Selection */
.theme-skyblue ::selection {
    background: #00b4d8;
}

.theme-skyblue ::-moz-selection {
    background: #00b4d8;
}

/* Expiry Warning Banners */
.theme-skyblue .expiry-warning-banner {
    background: linear-gradient(135deg, rgba(144, 224, 239, 0.15) 0%, rgba(0, 180, 216, 0.15) 100%);
    border-color: #00b4d8;
}

.theme-skyblue .warning-text h3 {
    color: #00b4d8;
}

.theme-skyblue .warning-text strong {
    color: #48cae4;
}

.theme-skyblue .btn-warning {
    background: linear-gradient(135deg, #00b4d8 0%, #0096c7 100%);
    color: #ffffff;
    box-shadow: 0 4px 15px rgba(0, 180, 216, 0.4);
}

.theme-skyblue .btn-warning:hover {
    box-shadow: 0 6px 20px rgba(0, 180, 216, 0.6);
}

/* Loading Animation */
.theme-skyblue .loading {
    background: linear-gradient(to right, rgba(0, 180, 216, 0.1) 0%, rgba(0, 180, 216, 0.3) 50%, rgba(0, 180, 216, 0.1) 100%);
}
