/*
|--------------------------------------------------------------------------
| EDID STUDIO PLATFORM
|--------------------------------------------------------------------------
| Dashboard V4
| Fichier : dashboard.css
|--------------------------------------------------------------------------
| Version : 4.0
|--------------------------------------------------------------------------
*/


/*==============================================================
RESET
==============================================================*/

*{

    margin:0;
    padding:0;
    box-sizing:border-box;

}

body{

    background:#080808;
    color:#ffffff;
    font-family:Inter,Arial,sans-serif;
    overflow-x:hidden;

}


/*==============================================================
APPLICATION
==============================================================*/

.edid-dashboard-app{

    display:flex;
    min-height:100vh;

}


/*==============================================================
IMAGE DE FOND
==============================================================*/

.edid-home{

    position:relative;
    flex:1;

    background-image:url("https://soleil-du-sud-record.fr/wp-content/uploads/sites/11/2025/04/espaceclient.png");

    background-position:center;

    background-size:cover;

    background-repeat:no-repeat;

    overflow:hidden;

}


/*==============================================================
VOILE
==============================================================*/

.edid-home::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(

        rgba(0,0,0,.72),

        rgba(0,0,0,.82)

    );

    backdrop-filter:blur(4px);

}


/*==============================================================
CONTENU
==============================================================*/

.edid-home>*{

    position:relative;

    z-index:2;

}
/*=============================================================================
 SIDEBAR
=============================================================================*/

.edid-sidebar{

    position:fixed;

    top:0;

    left:0;

    width:280px;

    height:100vh;

    background:rgba(10,10,10,.82);

    backdrop-filter:blur(18px);

    border-right:1px solid rgba(255,255,255,.08);

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    z-index:999;

}

/*=============================================================================
 LOGO
=============================================================================*/

.edid-sidebar-logo{

    padding:35px;

    text-align:center;

}

.edid-sidebar-logo h2{

    color:#d4af37;

    font-size:28px;

    letter-spacing:3px;

}

.edid-sidebar-logo span{

    display:block;

    color:#ffffff;

    opacity:.75;

    margin-top:8px;

    font-size:13px;

}

/*=============================================================================
 MENU
=============================================================================*/

.edid-sidebar-menu{

    display:flex;

    flex-direction:column;

    padding:20px;

    gap:12px;

}

.edid-sidebar-menu a{

    display:flex;

    align-items:center;

    gap:14px;

    padding:15px 18px;

    border-radius:14px;

    text-decoration:none;

    color:#ffffff;

    transition:.30s;

}

.edid-sidebar-menu a:hover{

    background:rgba(212,175,55,.15);

    transform:translateX(6px);

}

.edid-sidebar-menu a.active{

    background:#d4af37;

    color:#111111;

    font-weight:bold;

}

/*=============================================================================
 FOOTER
=============================================================================*/

.edid-sidebar-footer{

    padding:25px;

}

.edid-logout{

    display:block;

    text-align:center;

    text-decoration:none;

    color:#ffffff;

    padding:15px;

    border-radius:14px;

    background:#8c1d1d;

    transition:.30s;

}

.edid-logout:hover{

    background:#b32121;

}
/*=============================================================================
 HEADER
=============================================================================*/

.edid-dashboard-content{

    margin-left:280px;

    width:calc(100% - 280px);

}

.edid-header{

    height:90px;

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:0 40px;

    background:rgba(0,0,0,.45);

    backdrop-filter:blur(18px);

    border-bottom:1px solid rgba(255,255,255,.08);

}

.edid-header-title h1{

    font-size:30px;

    color:#ffffff;

}

.edid-header-title p{

    color:#bbbbbb;

    margin-top:6px;

}

.edid-header-right{

    display:flex;

    align-items:center;

    gap:20px;

}

.edid-search input{

    width:320px;

    padding:12px 18px;

    border:none;

    border-radius:14px;

    background:rgba(255,255,255,.08);

    color:#ffffff;

    outline:none;

}

.edid-search input::placeholder{

    color:#aaaaaa;

}

.edid-header-icon{

    width:48px;

    height:48px;

    border-radius:50%;

    background:rgba(255,255,255,.08);

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    transition:.30s;

}

.edid-header-icon:hover{

    background:#d4af37;

    color:#111111;

}

.edid-user{

    display:flex;

    align-items:center;

    gap:14px;

}

.edid-user img{

    border-radius:50%;

    border:2px solid #d4af37;

}

.edid-user span{

    display:block;

    color:#bbbbbb;

    font-size:13px;

}
/*=============================================================================
 HERO
=============================================================================*/

.edid-hero{

    margin:40px;

    padding:60px;

    border-radius:25px;

    background:rgba(255,255,255,.06);

    backdrop-filter:blur(18px);

}

.edid-hero h1{

    font-size:42px;

    color:#ffffff;

}

.edid-hero p{

    margin-top:15px;

    color:#d0d0d0;

}

/*=============================================================================
 CARTES
=============================================================================*/

.edid-cards{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(250px,1fr));

    gap:25px;

    margin:40px;

}

.edid-card{

    background:rgba(255,255,255,.08);

    backdrop-filter:blur(22px);

    border-radius:22px;

    padding:35px;

    border:1px solid rgba(255,255,255,.08);

    box-shadow:

        0 10px 40px rgba(0,0,0,.35),

        inset 0 1px 0 rgba(255,255,255,.08);

    transition:.35s;

    overflow:hidden;

    position:relative;

}
.edid-card:hover{

    transform:

        translateY(-8px)

        scale(1.02);

    border-color:#d4af37;

    box-shadow:

        0 20px 60px rgba(0,0,0,.45),

        0 0 25px rgba(212,175,55,.18);

}
.edid-card h3{

    color:#ffffff;

    margin-bottom:20px;

}

.edid-card span{

    font-size:38px;

    color:#d4af37;

    font-weight:bold;

}

/*=============================================================================
 PANELS
=============================================================================*/

.edid-panel{

    margin:40px;

    padding:35px;

    border-radius:20px;

    background:rgba(255,255,255,.05);

    backdrop-filter:blur(16px);

}

.edid-panel h2{

    margin-bottom:20px;

}

.edid-empty{

    color:#bdbdbd;

}
/*=============================================================================
 BACKGROUND CINÉMA
=============================================================================*/

.edid-dashboard-app{

    position:relative;

    min-height:100vh;

    overflow:hidden;

}

/*=============================================================================
 IMAGE DE FOND
=============================================================================*/

.edid-dashboard-app::before{

    content:"";

    position:fixed;

    inset:0;

    background-image:url("https://soleil-du-sud-record.fr/wp-content/uploads/sites/11/2025/04/espaceclient.png");

    background-size:cover;

    background-position:center;

    background-repeat:no-repeat;

    transform:scale(1.05);

    animation:edidZoom 35s ease-in-out infinite alternate;

    z-index:-3;

}

/*=============================================================================
 VOILE CINÉMA
=============================================================================*/

.edid-dashboard-app::after{

    content:"";

    position:fixed;

    inset:0;

    background:
    linear-gradient(
        135deg,
        rgba(0,0,0,.82),
        rgba(0,0,0,.60),
        rgba(8,8,8,.88)
    );

    z-index:-2;

}

/*=============================================================================
 ANIMATION
=============================================================================*/

@keyframes edidZoom{

    from{

        transform:scale(1.05);

    }

    to{

        transform:scale(1.12);

    }

}

/*=============================================================================
 REFLET GLASS
=============================================================================*/

.edid-card::before{

    content:"";

    position:absolute;

    top:-120px;

    left:-80px;

    width:220px;

    height:220px;

    background:

        radial-gradient(

            rgba(255,255,255,.18),

            transparent

        );

    transform:rotate(25deg);

}
.edid-dashboard-page

.edid-page-header

.edid-dashboard-grid

.edid-dashboard-card

.edid-dashboard-button
/*=============================================================================
 07 - VUES DASHBOARD
-----------------------------------------------------------------------------
 Description :
 Styles des vues internes du Dashboard
 (Mes projets, Production, Cloud, Livrables...)
=============================================================================*/


/*--------------------------------------------------------------
 PAGE
--------------------------------------------------------------*/

.edid-dashboard-page{

    width:100%;

    animation:edidFade .35s ease;

}


/*--------------------------------------------------------------
 EN-TÊTE DE PAGE
--------------------------------------------------------------*/

.edid-page-header{

    margin-bottom:35px;

}

.edid-page-header h1{

    font-size:34px;

    font-weight:700;

    color:#fff;

    margin-bottom:8px;

}

.edid-page-header p{

    color:#bdbdbd;

    font-size:15px;

}


/*--------------------------------------------------------------
 GRILLE
--------------------------------------------------------------*/

.edid-dashboard-grid{

    display:grid;

    grid-template-columns:repeat(auto-fill,minmax(340px,1fr));

    gap:25px;

}


/*--------------------------------------------------------------
 CARTE
--------------------------------------------------------------*/

.edid-dashboard-card{

    background:rgba(255,255,255,.05);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:18px;

    padding:25px;

    transition:.30s;

    overflow:hidden;

}

.edid-dashboard-card:hover{

    transform:translateY(-6px);

    border-color:rgba(212,175,55,.35);

    box-shadow:0 15px 45px rgba(0,0,0,.30);

}


/*--------------------------------------------------------------
 ICÔNE
--------------------------------------------------------------*/

.edid-card-icon{

    font-size:42px;

    margin-bottom:20px;

}


/*--------------------------------------------------------------
 TITRE
--------------------------------------------------------------*/

.edid-dashboard-card h3{

    color:#fff;

    margin-bottom:18px;

    font-size:22px;

}


/*--------------------------------------------------------------
 TEXTE
--------------------------------------------------------------*/

.edid-dashboard-card p{

    color:#d0d0d0;

    line-height:1.7;

    margin-bottom:12px;

}


/*--------------------------------------------------------------
 BOUTON
--------------------------------------------------------------*/

.edid-dashboard-button{

    display:inline-block;

    margin-top:25px;

    padding:12px 22px;

    border-radius:12px;

    background:linear-gradient(135deg,#D4AF37,#b58f22);

    color:#111;

    text-decoration:none;

    font-weight:700;

    transition:.25s;

}

.edid-dashboard-button:hover{

    transform:translateY(-3px);

}


/*--------------------------------------------------------------
 Animation
--------------------------------------------------------------*/

@keyframes edidFade{

    from{

        opacity:0;

        transform:translateY(15px);

    }

    to{

        opacity:1;

        transform:none;

    }

}
/*=============================================================================
 08 - BRANDING SIDEBAR
-----------------------------------------------------------------------------
 Description :
 Logo principal
/*=============================================================================
 09 - MODULE MES PROJETS
-----------------------------------------------------------------------------
 Description :
 Styles Premium du module Mes Projets
 Version : 4.0
=============================================================================*/


/*--------------------------------------------------------------
 CARTES PROJETS
--------------------------------------------------------------*/

.edid-project-card{

    display:flex;
    flex-direction:column;

    overflow:hidden;

    background:rgba(18,18,18,.82);

    backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.08);

    border-radius:22px;

    transition:.35s;

    box-shadow:0 12px 35px rgba(0,0,0,.28);

}

.edid-project-card:hover{

    transform:translateY(-8px);

    border-color:rgba(212,175,55,.35);

    box-shadow:0 25px 60px rgba(0,0,0,.40);

}


/*--------------------------------------------------------------
 IMAGE
--------------------------------------------------------------*/

.edid-project-cover{

    position:relative;

    height:180px;

    background:
    linear-gradient(rgba(0,0,0,.20),rgba(0,0,0,.65)),
    url("../images/studio-cover.jpg") center center;

    background-size:cover;

}

.edid-project-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        transparent,
        rgba(0,0,0,.55)
    );

}

.edid-project-icon{

    position:absolute;

    bottom:18px;

    left:22px;

    font-size:42px;

}


/*--------------------------------------------------------------
 CONTENU
--------------------------------------------------------------*/

.edid-project-content{

    padding:25px;

}


/*--------------------------------------------------------------
 HEADER
--------------------------------------------------------------*/

.edid-project-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:20px;

    margin-bottom:25px;

}

.edid-project-header h2{

    color:#fff;

    font-size:24px;

    margin:0;

}


/*--------------------------------------------------------------
 BADGES
--------------------------------------------------------------*/

.edid-status{

    padding:8px 16px;

    border-radius:50px;

    font-size:12px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.8px;

}

.edid-status-production{

    background:#1d7d3a;

    color:#fff;

}

.edid-status-validation{

    background:#d4af37;

    color:#111;

}

.edid-status-delivered{

    background:#1d4ed8;

    color:#fff;

}

.edid-status-cancelled{

    background:#c62828;

    color:#fff;

}

.edid-status-pending{

    background:#555;

    color:#fff;

}


/*--------------------------------------------------------------
 META
--------------------------------------------------------------*/

.edid-project-meta{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:18px;

}

.edid-project-meta div{

    display:flex;

    flex-direction:column;

}

.edid-project-meta strong{

    color:#D4AF37;

    font-size:12px;

    text-transform:uppercase;

    margin-bottom:6px;

}

.edid-project-meta span{

    color:#ddd;

}


/*--------------------------------------------------------------
 FOOTER
--------------------------------------------------------------*/

.edid-project-footer{

    margin-top:30px;

}


/*--------------------------------------------------------------
 BOUTON
--------------------------------------------------------------*/

.edid-project-button{

    display:block;

    width:100%;

    text-align:center;

    padding:15px;

    border-radius:14px;

    text-decoration:none;

    font-weight:700;

    background:linear-gradient(
        135deg,
        #D4AF37,
        #b88d14
    );

    color:#111;

    transition:.25s;

}

.edid-project-button:hover{

    transform:translateY(-3px);

}


/*--------------------------------------------------------------
 AUCUN PROJET
--------------------------------------------------------------*/

.edid-empty-state{

    grid-column:1/-1;

    padding:80px 40px;

    text-align:center;

    border-radius:22px;

    background:rgba(255,255,255,.04);

    border:1px solid rgba(255,255,255,.08);

}

.edid-empty-icon{

    font-size:70px;

    margin-bottom:20px;

}

.edid-empty-state h2{

    color:#fff;

    margin-bottom:12px;

}

.edid-empty-state p{

    color:#aaa;

}


/*--------------------------------------------------------------
 RESPONSIVE
--------------------------------------------------------------*/

@media(max-width:900px){

    .edid-project-meta{

        grid-template-columns:1fr;

    }

    .edid-project-header{

        flex-direction:column;

        align-items:flex-start;

    }

}
/*==============================================================
TEST VALIDÉ - VERSION PREMIUM
==============================================================*/

.edid-project-card{

    border:2px solid #D4AF37 !important;

    background:rgba(18,18,18,.88) !important;

    box-shadow:
        0 15px 40px rgba(0,0,0,.45),
        0 0 18px rgba(212,175,55,.20);

}

.edid-project-header h2{

    color:#ffffff !important;

    font-size:22px !important;

}

.edid-project-button{

    background:linear-gradient(
        135deg,
        #D4AF37,
        #B58F22
    ) !important;

    color:#111 !important;

}
/*=============================================================================
10 - MODULE PRODUCTION
-----------------------------------------------------------------------------
Description :
Styles de l'espace Production
=============================================================================*/


/*--------------------------------------------------------------
GRILLE
--------------------------------------------------------------*/

.edid-production-grid{

    display:grid;

    grid-template-columns:repeat(auto-fit,minmax(380px,1fr));

    gap:30px;

    margin-top:35px;

}


/*--------------------------------------------------------------
CARTE
--------------------------------------------------------------*/

.edid-production-card{

    background:rgba(18,18,18,.82);

    backdrop-filter:blur(18px);

    border:1px solid rgba(212,175,55,.18);

    border-radius:22px;

    padding:30px;

    transition:.30s;

    box-shadow:
        0 10px 35px rgba(0,0,0,.35);

}

.edid-production-card:hover{

    transform:translateY(-6px);

    border-color:#D4AF37;

    box-shadow:
        0 18px 45px rgba(0,0,0,.45),
        0 0 18px rgba(212,175,55,.18);

}

.edid-production-card h2{

    color:#D4AF37;

    margin-bottom:25px;

}


/*--------------------------------------------------------------
TABLEAU
--------------------------------------------------------------*/

.edid-production-table{

    width:100%;

    border-collapse:collapse;

}

.edid-production-table td{

    padding:14px 0;

    border-bottom:1px solid rgba(255,255,255,.08);

}

.edid-production-table td:first-child{

    width:160px;

    color:#D4AF37;

    font-weight:700;

}

.edid-production-table td:last-child{

    color:#ffffff;

}


/*--------------------------------------------------------------
UPLOAD
--------------------------------------------------------------*/

.edid-upload-zone{

    border:2px dashed rgba(212,175,55,.45);

    border-radius:18px;

    padding:60px 30px;

    text-align:center;

    transition:.30s;

    cursor:pointer;

}

.edid-upload-zone:hover{

    background:rgba(212,175,55,.08);

    border-color:#D4AF37;

}

.edid-upload-zone i{

    font-size:55px;

    color:#D4AF37;

    margin-bottom:20px;

}

.edid-upload-zone h3{

    color:#fff;

    margin-bottom:12px;

}

.edid-upload-zone p{

    color:#bbb;

}

.edid-upload-zone input{

    display:none;

}


/*--------------------------------------------------------------
FICHIERS
--------------------------------------------------------------*/

.edid-production-files{

    display:flex;

    flex-direction:column;

    gap:15px;

}

.edid-file{

    display:flex;

    align-items:center;

    gap:15px;

    padding:18px;

    border-radius:14px;

    background:rgba(255,255,255,.05);

}

.edid-file i{

    font-size:26px;

    color:#D4AF37;

}


/*--------------------------------------------------------------
ACTIONS
--------------------------------------------------------------*/

.edid-production-actions{

    display:flex;

    flex-wrap:wrap;

    gap:15px;

}


/*--------------------------------------------------------------
ACTIVITÉ
--------------------------------------------------------------*/

.edid-production-activity{

    display:flex;

    flex-direction:column;

    gap:18px;

}

.edid-activity-item{

    padding:15px;

    border-left:4px solid #D4AF37;

    background:rgba(255,255,255,.04);

    border-radius:10px;

}

.edid-activity-date{

    display:block;

    color:#D4AF37;

    font-size:13px;

    margin-bottom:8px;

}

.edid-activity-text{

    color:#ffffff;

}


/*--------------------------------------------------------------
COMMENTAIRE
--------------------------------------------------------------*/

.edid-production-comment{

    width:100%;

    min-height:160px;

    padding:18px;

    border-radius:16px;

    border:1px solid rgba(255,255,255,.10);

    background:rgba(255,255,255,.05);

    color:#ffffff;

    resize:vertical;

    outline:none;

}

.edid-production-comment:focus{

    border-color:#D4AF37;

}


/*--------------------------------------------------------------
RESPONSIVE
--------------------------------------------------------------*/

@media(max-width:900px){

    .edid-production-grid{

        grid-template-columns:1fr;

    }

}
/*==============================================================
DRAG & DROP
==============================================================*/

.edid-upload-zone{

    transition:.25s;

}

.edid-upload-zone.drag-over{

    background:rgba(212,175,55,.12);

    border-color:#D4AF37;

    transform:scale(1.02);

}
/*
|--------------------------------------------------------------------------
| Barre de progression Upload
|--------------------------------------------------------------------------
*/

#edid-upload-progress{

    display:none;

    margin-top:20px;

}

.edid-progress-bar{

    width:100%;

    height:12px;

    background:#2b2b2b;

    border-radius:20px;

    overflow:hidden;

    border:1px solid #444;

}

.edid-progress-fill{

    width:0;

    height:100%;

    background:linear-gradient(
        90deg,
        #c8a96a,
        #f2d28b
    );

    transition:width .2s linear;

}

.edid-progress-text{

    margin-top:8px;

    text-align:center;

    color:#c8a96a;

    font-weight:600;

    font-size:14px;

}