﻿/* Custom LifeDesk Theme - Extended Edition */

/* LifeDesk Color Palette - Based on Minty Theme */

:root {
    /* Primary Colors */
    --ld-primary: #78c2ad;
    --ld-primary-light: #8dd0bc;
    --ld-primary-dark: #69b39e;
    --ld-primary-hover: #6bb5a0;
    /* Secondary Colors */
    --ld-secondary: #f3969a;
    --ld-secondary-light: #f6adb0;
    --ld-secondary-dark: #f07f84;
    --ld-secondary-hover: #f18a8f;
    /* Semantic Colors */
    --ld-success: #56cc9d;
    --ld-success-light: #6fd8ab;
    --ld-success-dark: #4ab88c;
    --ld-info: #6cc3d5;
    --ld-info-light: #85cedd;
    --ld-info-dark: #5ab5c9;
    --ld-warning: #ffce67;
    --ld-warning-light: #ffd885;
    --ld-warning-dark: #ffc34f;
    --ld-danger: #ff7851;
    --ld-danger-light: #ff9274;
    --ld-danger-dark: #ff5e38;
    /* Neutral Colors */
    --ld-light: #f8f9fa;
    --ld-lighter: #ffffff;
    --ld-gray-100: #f8f9fa;
    --ld-gray-200: #f7f7f9;
    --ld-gray-300: #eceeef;
    --ld-gray-400: #ced4da;
    --ld-gray-500: #aaaaaa;
    --ld-gray-600: #888888;
    --ld-gray-700: #5a5a5a;
    --ld-gray-800: #343a40;
    --ld-dark: #343a40;
    /* Opacity Variants */
    --ld-primary-10: rgba(120, 194, 173, 0.1);
    --ld-primary-20: rgba(120, 194, 173, 0.2);
    --ld-primary-30: rgba(120, 194, 173, 0.3);
    --ld-secondary-10: rgba(243, 150, 154, 0.1);
    --ld-secondary-20: rgba(243, 150, 154, 0.2);
}

/* ========================================
   GRADIENTI BASE - Header & Navigation
   ======================================== */

.ld-gradient-header {
    background: linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
}

.ld-gradient-header-alt {
    background: linear-gradient(90deg, #69b39e 0%, #78c2ad 50%, #85cedd 100%);
}

.ld-gradient-header-soft {
    background: linear-gradient(180deg, #78c2ad 0%, #8dd0bc 100%);
}

/* Gradiente con effetto "glass" per header */
.ld-gradient-header-glass {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.95) 0%, rgba(108, 195, 213, 0.95) 100%);
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

/* Gradiente radiale per header hero */
.ld-gradient-hero {
    background: radial-gradient(ellipse at top, #78c2ad 0%, #69b39e 50%, #5ab5c9 100%);
}

/* ========================================
   GRADIENTI CARD - Sfondi & Contenitori
   ======================================== */

.ld-card-gradient {
    background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(120, 194, 173, 0.2);
}

.ld-card-primary {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.1) 0%, rgba(108, 195, 213, 0.1) 100%);
    border-left: 4px solid #78c2ad;
}

.ld-card-highlight {
    background: linear-gradient(to bottom right, #78c2ad15, #6cc3d515);
}

/* Nuovi gradienti card */
.ld-card-glow {
    background: linear-gradient(135deg, #ffffff 0%, rgba(120, 194, 173, 0.05) 100%);
    box-shadow: 0 8px 32px rgba(120, 194, 173, 0.15);
}

.ld-card-elevated {
    background: linear-gradient(160deg, #ffffff 0%, #f8f9fa 60%, rgba(120, 194, 173, 0.08) 100%);
    box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.ld-card-sunset {
    background: linear-gradient(135deg, rgba(243, 150, 154, 0.1) 0%, rgba(255, 206, 103, 0.1) 50%, rgba(120, 194, 173, 0.1) 100%);
}

.ld-card-ocean {
    background: linear-gradient(120deg, rgba(108, 195, 213, 0.12) 0%, rgba(120, 194, 173, 0.08) 100%);
}

/* ========================================
   GRADIENTI BUTTON - Interattivi
   ======================================== */

.ld-btn-primary-gradient {
    background: linear-gradient(135deg, #78c2ad 0%, #69b39e 100%);
    border: none;
    color: white;
    transition: all 0.3s ease;
}

    .ld-btn-primary-gradient:hover {
        background: linear-gradient(135deg, #8dd0bc 0%, #78c2ad 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(120, 194, 173, 0.4);
    }

.ld-btn-secondary-gradient {
    background: linear-gradient(135deg, #f3969a 0%, #f07f84 100%);
    border: none;
    color: white;
}

.ld-btn-success-gradient {
    background: linear-gradient(135deg, #56cc9d 0%, #4ab88c 100%);
    border: none;
    color: white;
}

.ld-btn-outline-primary {
    background: transparent;
    border: 2px solid #78c2ad;
    color: #78c2ad;
}

    .ld-btn-outline-primary:hover {
        background: linear-gradient(135deg, #78c2ad 0%, #69b39e 100%);
        color: white;
    }

.ld-btn-outline-secondary {
    background: transparent;
    border: 2px solid #f3969a;
    color: #f3969a;
}

    .ld-btn-outline-secondary:hover {
        background: linear-gradient(135deg, #f3969a 0%, #f07f84 100%);
        color: white;
    }

.ld-btn-info-gradient {
    background: linear-gradient(135deg, #6cc3d5 0%, #5ab5c9 100%);
    border: none;
    color: white;
    transition: all 0.3s ease;
}

    .ld-btn-info-gradient:hover {
        background: linear-gradient(135deg, #85cedd 0%, #6cc3d5 100%);
        transform: translateY(-2px);
        box-shadow: 0 4px 12px rgba(108, 195, 213, 0.4);
    }

/* Nuovi gradienti button */
.ld-btn-shine {
    background: linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    position: relative;
    overflow: hidden;
}

    .ld-btn-shine::before {
        content: '';
        position: absolute;
        top: 0;
        left: -100%;
        width: 100%;
        height: 100%;
        background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
        transition: left 0.5s;
    }

    .ld-btn-shine:hover::before {
        left: 100%;
    }

.ld-btn-pulse {
    background: linear-gradient(135deg, #56cc9d 0%, #6cc3d5 100%);
    animation: pulse-glow 2s ease-in-out infinite;
}

@keyframes pulse-glow {
    0%, 100% {
        box-shadow: 0 0 20px rgba(86, 204, 157, 0.4);
    }

    50% {
        box-shadow: 0 0 40px rgba(108, 195, 213, 0.6);
    }
}

.ld-btn-3d {
    background: linear-gradient(180deg, #78c2ad 0%, #69b39e 100%);
    box-shadow: 0 4px 0 #5a9e8d, 0 8px 16px rgba(0, 0, 0, 0.2);
    transition: all 0.2s;
}

    .ld-btn-3d:active {
        transform: translateY(4px);
        box-shadow: 0 0 0 #5a9e8d, 0 4px 8px rgba(0, 0, 0, 0.2);
    }

/* ========================================
   GRADIENTI BADGE & LABEL
   ======================================== */

.ld-badge-active {
    background: linear-gradient(90deg, #56cc9d 0%, #6fd8ab 100%);
    color: white;
}

.ld-badge-pending {
    background: linear-gradient(90deg, #ffce67 0%, #ffd885 100%);
    color: #5a5a5a;
}

.ld-badge-alert {
    background: linear-gradient(90deg, #ff7851 0%, #ff9274 100%);
    color: white;
}

.ld-badge-info {
    background: linear-gradient(90deg, #6cc3d5 0%, #85cedd 100%);
    color: white;
}

.ld-badge-neutral {
    background: linear-gradient(90deg, #aaaaaa 0%, #ced4da 100%);
    color: white;
}

/* Nuovi badge */
.ld-badge-premium {
    background: linear-gradient(135deg, #ffd700 0%, #ffed4e 50%, #ffd700 100%);
    color: #5a5a5a;
    font-weight: bold;
}

.ld-badge-urgent {
    background: linear-gradient(90deg, #ff5e38 0%, #ff7851 50%, #ff9274 100%);
    color: white;
    animation: badge-pulse 1.5s ease-in-out infinite;
}

@keyframes badge-pulse {
    0%, 100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }
}

.ld-badge-completed {
    background: linear-gradient(90deg, #4ab88c 0%, #56cc9d 50%, #6fd8ab 100%);
    color: white;
}

/* ========================================
   GRADIENTI SIDEBAR & NAVIGATION
   ======================================== */

.ld-sidebar-gradient {
    background: linear-gradient(180deg, #343a40 0%, #5a5a5a 100%);
}

.ld-sidebar-light {
    background: linear-gradient(180deg, #f8f9fa 0%, #eceeef 100%);
    border-right: 1px solid rgba(120, 194, 173, 0.2);
}

.ld-nav-item-active {
    background: linear-gradient(90deg, rgba(120, 194, 173, 0.2) 0%, transparent 100%);
    border-left: 4px solid #78c2ad;
}

/* Nuovi gradienti sidebar */
.ld-sidebar-primary {
    background: linear-gradient(180deg, #69b39e 0%, #5a9e8d 100%);
}

.ld-sidebar-modern {
    background: linear-gradient(135deg, #343a40 0%, #5a5a5a 50%, #69b39e 100%);
}

.ld-nav-item-hover {
    background: linear-gradient(90deg, transparent 0%, rgba(120, 194, 173, 0.15) 50%, transparent 100%);
    transition: all 0.3s ease;
}

/* ========================================
   GRADIENTI INPUT & FORM
   ======================================== */

.ld-input-focus {
    border-color: #78c2ad;
    box-shadow: 0 0 0 0.2rem rgba(120, 194, 173, 0.25);
}

.ld-input-error {
    border-color: #ff7851;
    box-shadow: 0 0 0 0.2rem rgba(255, 120, 81, 0.25);
}

.ld-input-success {
    border-color: #56cc9d;
    box-shadow: 0 0 0 0.2rem rgba(86, 204, 157, 0.25);
}

/* Nuovi gradienti input */
.ld-input-gradient-border {
    border: 2px solid transparent;
    background-image: linear-gradient(white, white), linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}

    .ld-input-gradient-border:focus {
        background-image: linear-gradient(white, white), linear-gradient(135deg, #56cc9d 0%, #6cc3d5 100%);
    }

/* ========================================
   GRADIENTI TABLE
   ======================================== */

.ld-table-header {
    background: linear-gradient(180deg, #78c2ad 0%, #69b39e 100%);
    color: white;
}

.ld-table-row-hover {
    background: linear-gradient(90deg, rgba(120, 194, 173, 0.05) 0%, transparent 100%);
}

.ld-table-row-selected {
    background: linear-gradient(90deg, rgba(120, 194, 173, 0.15) 0%, rgba(108, 195, 213, 0.1) 100%);
}

.ld-table-striped-primary {
    background: rgba(120, 194, 173, 0.05);
}

/* Nuovi gradienti table */
.ld-table-row-highlight {
    background: linear-gradient(90deg, rgba(255, 206, 103, 0.1) 0%, rgba(255, 216, 133, 0.05) 50%, transparent 100%);
}

.ld-table-footer {
    background: linear-gradient(180deg, rgba(120, 194, 173, 0.05) 0%, rgba(120, 194, 173, 0.1) 100%);
    border-top: 2px solid #78c2ad;
}

/* ========================================
   GRADIENTI MODAL & OVERLAY
   ======================================== */

.ld-modal-header {
    background: linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    color: white;
}

.ld-modal-overlay {
    background: linear-gradient(135deg, rgba(52, 58, 64, 0.8) 0%, rgba(90, 90, 90, 0.8) 100%);
}

/* Nuovi gradienti modal */
.ld-modal-footer-gradient {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fa 100%);
    border-top: 1px solid rgba(120, 194, 173, 0.2);
}

.ld-modal-backdrop-blur {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.4) 0%, rgba(108, 195, 213, 0.4) 100%);
    backdrop-filter: blur(8px);
}

/* ========================================
   GRADIENTI PROGRESS & LOADING
   ======================================== */

.ld-progress-primary {
    background: linear-gradient(90deg, #78c2ad 0%, #6cc3d5 100%);
    background-size: 200% 100%;
    animation: ld-progress-animate 2s linear infinite;
}

@keyframes ld-progress-animate {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.ld-spinner-gradient {
    border: 4px solid rgba(120, 194, 173, 0.2);
    border-top: 4px solid #78c2ad;
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

/* Nuovi gradienti progress */
.ld-progress-rainbow {
    background: linear-gradient(90deg, #56cc9d 0%, #6cc3d5 25%, #78c2ad 50%, #ffce67 75%, #f3969a 100%);
    background-size: 300% 100%;
    animation: rainbow-flow 3s linear infinite;
}

@keyframes rainbow-flow {
    0% {
        background-position: 0% 50%;
    }

    100% {
        background-position: 300% 50%;
    }
}

.ld-progress-striped {
    background: repeating-linear-gradient( 45deg, #78c2ad, #78c2ad 10px, #8dd0bc 10px, #8dd0bc 20px );
    background-size: 200% 100%;
    animation: stripe-move 1s linear infinite;
}

@keyframes stripe-move {
    0% {
        background-position: 0 0;
    }

    100% {
        background-position: 40px 0;
    }
}

.ld-loading-skeleton {
    background: linear-gradient(90deg, #f0f0f0 0%, #e0e0e0 50%, #f0f0f0 100%);
    background-size: 200% 100%;
    animation: skeleton-loading 1.5s ease-in-out infinite;
}

@keyframes skeleton-loading {
    0% {
        background-position: -200% 0;
    }

    100% {
        background-position: 200% 0;
    }
}

/* ========================================
   GRADIENTI ALERT
   ======================================== */

.ld-alert-success {
    background: linear-gradient(135deg, rgba(86, 204, 157, 0.1) 0%, rgba(111, 216, 171, 0.1) 100%);
    border-left: 4px solid #56cc9d;
}

.ld-alert-warning {
    background: linear-gradient(135deg, rgba(255, 206, 103, 0.1) 0%, rgba(255, 216, 133, 0.1) 100%);
    border-left: 4px solid #ffce67;
}

.ld-alert-danger {
    background: linear-gradient(135deg, rgba(255, 120, 81, 0.1) 0%, rgba(255, 146, 116, 0.1) 100%);
    border-left: 4px solid #ff7851;
}

.ld-alert-info {
    background: linear-gradient(135deg, rgba(108, 195, 213, 0.1) 0%, rgba(133, 206, 221, 0.1) 100%);
    border-left: 4px solid #6cc3d5;
}

/* Nuovi alert con animazione */
.ld-alert-animated {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.1) 0%, rgba(108, 195, 213, 0.1) 50%, rgba(120, 194, 173, 0.1) 100%);
    background-size: 200% 100%;
    animation: alert-shimmer 3s ease-in-out infinite;
}

@keyframes alert-shimmer {
    0%, 100% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }
}

/* ========================================
   GRADIENTI WIDGET - Dashboard
   ======================================== */

.ld-widget-turni {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.9) 0%, rgba(105, 179, 158, 0.9) 100%);
    color: white;
}

.ld-widget-operatori {
    background: linear-gradient(135deg, rgba(108, 195, 213, 0.9) 0%, rgba(90, 181, 201, 0.9) 100%);
    color: white;
}

.ld-widget-eventi {
    background: linear-gradient(135deg, rgba(243, 150, 154, 0.9) 0%, rgba(240, 127, 132, 0.9) 100%);
    color: white;
}

.ld-widget-risorse {
    background: linear-gradient(135deg, rgba(86, 204, 157, 0.9) 0%, rgba(74, 184, 140, 0.9) 100%);
    color: white;
}

/* Nuovi widget */
.ld-widget-statistics {
    background: linear-gradient(135deg, #ffce67 0%, #ffd885 100%);
    color: #5a5a5a;
}

.ld-widget-notifications {
    background: linear-gradient(135deg, #f3969a 0%, #f6adb0 100%);
    color: white;
}

.ld-widget-glass {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.9) 0%, rgba(248, 249, 250, 0.8) 100%);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(120, 194, 173, 0.3);
}

/* ========================================
   GRADIENTI DEVEXPRESS - Override
   ======================================== */

.dx-btn-ld-primary {
    background: linear-gradient(135deg, #78c2ad 0%, #69b39e 100%) !important;
    border-color: #78c2ad !important;
}

    .dx-btn-ld-primary:hover {
        background: linear-gradient(135deg, #8dd0bc 0%, #78c2ad 100%) !important;
    }

.dx-grid-ld-header {
    background: linear-gradient(180deg, #78c2ad 0%, #69b39e 100%) !important;
    color: white !important;
    font-weight: 600;
}

.dx-card-ld {
    background: linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%);
    border: 1px solid rgba(120, 194, 173, 0.2);
    border-radius: 0.4rem;
}

.dx-tab-ld-active {
    background: linear-gradient(180deg, #78c2ad 0%, #69b39e 100%) !important;
    color: white !important;
    border-bottom: 3px solid #56cc9d;
}

.dx-panel-ld-header {
    background: linear-gradient(90deg, #78c2ad 0%, #6cc3d5 100%);
    color: white;
    padding: 0.75rem 1rem;
    border-radius: 0.4rem 0.4rem 0 0;
}

/* ========================================
   NUOVI GRADIENTI SPECIALI
   ======================================== */

/* Timeline con gradiente */
.ld-timeline-gradient {
    background: linear-gradient(180deg, transparent 0%, rgba(120, 194, 173, 0.1) 50%, transparent 100%);
    border-left: 3px solid #78c2ad;
}

/* Tooltip con gradiente */
.ld-tooltip-gradient {
    background: linear-gradient(135deg, #343a40 0%, #5a5a5a 100%);
    color: white;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.3);
}

/* Notification con gradiente animato */
.ld-notification-success {
    background: linear-gradient(90deg, rgba(86, 204, 157, 0.95) 0%, rgba(111, 216, 171, 0.95) 100%);
    border-left: 4px solid #4ab88c;
    animation: slide-in-right 0.4s ease-out;
}

@keyframes slide-in-right {
    from {
        transform: translateX(100%);
        opacity: 0;
    }

    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Divider con gradiente */
.ld-divider-gradient {
    height: 2px;
    background: linear-gradient(90deg, transparent 0%, #78c2ad 50%, transparent 100%);
}

/* Pricing card con gradiente */
.ld-pricing-featured {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.05) 0%, rgba(108, 195, 213, 0.05) 50%, rgba(86, 204, 157, 0.05) 100%);
    border: 2px solid #78c2ad;
    position: relative;
    overflow: hidden;
}

    .ld-pricing-featured::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        height: 4px;
        background: linear-gradient(90deg, #56cc9d 0%, #78c2ad 50%, #6cc3d5 100%);
    }

/* Status indicator con gradiente */
.ld-status-online {
    background: radial-gradient(circle, #56cc9d 0%, #4ab88c 100%);
    box-shadow: 0 0 10px rgba(86, 204, 157, 0.6);
}

.ld-status-busy {
    background: radial-gradient(circle, #ff7851 0%, #ff5e38 100%);
    box-shadow: 0 0 10px rgba(255, 120, 81, 0.6);
}

.ld-status-away {
    background: radial-gradient(circle, #ffce67 0%, #ffc34f 100%);
    box-shadow: 0 0 10px rgba(255, 206, 103, 0.6);
}

/* Chart background */
.ld-chart-background {
    background: linear-gradient(180deg, rgba(120, 194, 173, 0.05) 0%, transparent 100%);
}

/* Floating action button */
.ld-fab-gradient {
    background: linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    box-shadow: 0 6px 20px rgba(120, 194, 173, 0.4);
    transition: all 0.3s ease;
}

    .ld-fab-gradient:hover {
        background: linear-gradient(135deg, #8dd0bc 0%, #85cedd 100%);
        box-shadow: 0 8px 28px rgba(120, 194, 173, 0.5);
        transform: translateY(-2px) scale(1.05);
    }

/* Ribbon/Banner */
.ld-ribbon-new {
    background: linear-gradient(135deg, #ff7851 0%, #ffce67 100%);
    color: white;
    font-weight: bold;
    text-transform: uppercase;
}

.ld-ribbon-featured {
    background: linear-gradient(135deg, #56cc9d 0%, #6cc3d5 100%);
    color: white;
    font-weight: bold;
}

/* Scrollbar personalizzata */
.ld-scrollbar-gradient::-webkit-scrollbar {
    width: 8px;
}

.ld-scrollbar-gradient::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.ld-scrollbar-gradient::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #78c2ad 0%, #69b39e 100%);
    border-radius: 4px;
}

    .ld-scrollbar-gradient::-webkit-scrollbar-thumb:hover {
        background: linear-gradient(180deg, #8dd0bc 0%, #78c2ad 100%);
    }

/* Text gradient */
.ld-text-gradient-primary {
    background: linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: bold;
}

.ld-text-gradient-sunset {
    background: linear-gradient(90deg, #ff7851 0%, #ffce67 50%, #56cc9d 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    font-weight: bold;
}

/* Overlay patterns */
.ld-pattern-dots {
    background-image: linear-gradient(135deg, rgba(120, 194, 173, 0.05) 0%, rgba(108, 195, 213, 0.05) 100%), radial-gradient(circle, rgba(120, 194, 173, 0.15) 1px, transparent 1px);
    background-size: 100% 100%, 20px 20px;
}

.ld-pattern-grid {
    background-image: linear-gradient(135deg, #ffffff 0%, #f8f9fa 100%), repeating-linear-gradient(0deg, rgba(120, 194, 173, 0.1) 0px, transparent 1px, transparent 20px), repeating-linear-gradient(90deg, rgba(120, 194, 173, 0.1) 0px, transparent 1px, transparent 20px);
}

/* Animated gradient background */
@keyframes gradient-shift {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.ld-animated-bg {
    background: linear-gradient(135deg, rgba(120, 194, 173, 0.1) 0%, rgba(108, 195, 213, 0.1) 25%, rgba(86, 204, 157, 0.1) 50%, rgba(108, 195, 213, 0.1) 75%, rgba(120, 194, 173, 0.1) 100%);
    background-size: 400% 400%;
    animation: gradient-shift 15s ease infinite;
}

/* Hover effect - Glow */
.ld-hover-glow {
    transition: all 0.3s ease;
}

    .ld-hover-glow:hover {
        box-shadow: 0 0 30px rgba(120, 194, 173, 0.5), 0 0 60px rgba(108, 195, 213, 0.3);
    }

/* Border gradient */
.ld-border-gradient {
    border: 3px solid transparent;
    background-image: linear-gradient(white, white), linear-gradient(135deg, #78c2ad 0%, #6cc3d5 100%);
    background-origin: border-box;
    background-clip: padding-box, border-box;
}

/* ========================================
   UTILITY CLASSES
   ======================================== */

.ld-shadow-gradient {
    box-shadow: 0 10px 40px rgba(120, 194, 173, 0.2);
}

.ld-shadow-gradient-hover:hover {
    box-shadow: 0 15px 60px rgba(120, 194, 173, 0.3);
}

.ld-overlay-gradient {
    position: relative;
}

    .ld-overlay-gradient::after {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient(135deg, rgba(120, 194, 173, 0.8) 0%, rgba(108, 195, 213, 0.8) 100%);
        pointer-events: none;
    }

/* ========================================
   RESPONSIVE ADJUSTMENTS
   ======================================== */

@media (max-width: 768px) {
    .ld-gradient-header-alt {
        background: linear-gradient(180deg, #69b39e 0%, #78c2ad 100%);
    }

    .ld-sidebar-gradient {
        background: linear-gradient(90deg, #343a40 0%, #5a5a5a 100%);
    }
}
