/* ==========================================================
   EVERYONE ASSEMBLE
   APPLICATION UCP
   Ergänzung zum bestehenden .eaucp-page Design
   ========================================================== */

/* ==========================================================
   HAUPTSEITE
   ========================================================== */

.eaapp-page .eaucp-body{
    padding:25px;
}

.eaapp-form{
    position:relative;
}

.eaapp-panel{
    position:relative;
    background:
        linear-gradient(
            145deg,
            rgba(8,43,69,.86),
            rgba(4,25,43,.96)
        );
    border:1px solid var(--eaucp-line-soft);
    box-shadow:
        0 14px 28px rgba(0,0,0,.24),
        inset 0 1px 0 rgba(255,255,255,.025);
    overflow:hidden;
}

.eaapp-panel::before{
    content:"";
    position:absolute;
    z-index:3;
    top:0;
    left:0;
    width:50px;
    height:2px;
    background:var(--eaucp-accent-light);
    box-shadow:
        50px 0 0 var(--eaucp-accent),
        100px 0 0 rgba(33,139,208,.38);
}

.eaapp-panel::after{
    content:"";
    position:absolute;
    z-index:0;
    right:-55px;
    bottom:-55px;
    width:150px;
    height:150px;
    border:1px solid rgba(117,208,255,.05);
    transform:rotate(45deg);
    pointer-events:none;
}

.eaapp-panel-head{
    position:relative;
    z-index:1;
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    padding:20px 22px;
    background:
        linear-gradient(
            90deg,
            rgba(33,139,208,.14),
            transparent
        ),
        rgba(1,9,20,.28);
    border-bottom:1px solid var(--eaucp-line-soft);
}

.eaapp-panel-head-copy{
    min-width:0;
}

.eaapp-panel-code{
    display:block;
    margin-bottom:4px;
    color:var(--eaucp-muted);
    font-size:9px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:2px;
    text-transform:uppercase;
}

.eaapp-panel-title{
    margin:0;
    color:var(--eaucp-text);
    font-size:15px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:1px;
    text-transform:uppercase;
}

.eaapp-panel-status{
    flex-shrink:0;
    padding:7px 11px;
    color:var(--eaucp-accent-light);
    background:rgba(33,139,208,.09);
    border:1px solid var(--eaucp-line-soft);
    font-size:9px;
    font-weight:700;
    letter-spacing:1.4px;
    text-transform:uppercase;
}

.eaapp-panel-body{
    position:relative;
    z-index:1;
    padding:22px;
}

/* ==========================================================
   INFORMATIONSBEREICH
   ========================================================== */

.aucp_infoheader{
    position:relative;
    margin-bottom:18px;
    padding:15px 18px 15px 49px;
    color:var(--eaucp-text-soft);
    background:
        linear-gradient(
            90deg,
            rgba(33,139,208,.13),
            rgba(1,9,20,.34)
        );
    border:1px solid var(--eaucp-line-soft);
    font-size:10px;
    line-height:1.65;
}

.aucp_infoheader::before{
    content:"INFO";
    position:absolute;
    top:50%;
    left:13px;
    display:flex;
    justify-content:center;
    align-items:center;
    width:25px;
    height:25px;
    color:var(--eaucp-accent-light);
    background:var(--eaucp-bg-deep);
    border:1px solid var(--eaucp-accent);
    font-size:7px;
    font-weight:800;
    letter-spacing:.5px;
    transform:translateY(-50%) rotate(45deg);
}

.aucp_infoheader::after{
    content:"INFO";
    position:absolute;
    top:50%;
    left:13px;
    display:flex;
    justify-content:center;
    align-items:center;
    width:25px;
    height:25px;
    color:var(--eaucp-accent-light);
    font-size:7px;
    font-weight:800;
    letter-spacing:.5px;
    transform:translateY(-50%);
}

/* ==========================================================
   FORMULAR UND FELDER
   ========================================================== */

.applucp-con{
    display:grid;
    width:100%;
    margin:0;
    gap:12px;
}

.applucp-con > h3{
    display:none;
}

.applucp-con__item{
    position:relative;
    display:grid;
    gap:8px;
    min-width:0;
    padding:15px;
    color:var(--eaucp-text-soft);
    background:
        linear-gradient(
            145deg,
            rgba(1,9,20,.45),
            rgba(8,43,69,.4)
        );
    border:1px solid rgba(29,95,143,.21);
}

.applucp-con__item::before{
    content:"";
    position:absolute;
    top:-1px;
    left:-1px;
    width:13px;
    height:13px;
    border-top:1px solid var(--eaucp-accent);
    border-left:1px solid var(--eaucp-accent);
}

.applucp-con__item:hover{
    border-color:var(--eaucp-line-soft);
}

.app_ucp_label{
    display:block;
    margin:0;
    color:var(--eaucp-text-soft);
    font-size:10px;
    font-weight:700;
    line-height:1.5;
    letter-spacing:.6px;
    text-align:left;
    text-transform:uppercase;
}

.applucp-con__item .smalltext{
    color:var(--eaucp-muted);
    font-size:9px;
    line-height:1.55;
}

.applucp-con input[type="text"],
.applucp-con input[type="password"],
.applucp-con input[type="email"],
.applucp-con input[type="url"],
.applucp-con input[type="number"],
.applucp-con input[type="date"],
.applucp-con select,
.applucp-con textarea{
    display:block;
    width:100%;
    max-width:none;
    min-height:40px;
    margin:0;
    padding:9px 11px;
    color:var(--eaucp-text);
    background:
        linear-gradient(
            145deg,
            rgba(1,9,20,.94),
            rgba(4,25,43,.94)
        );
    border:1px solid var(--eaucp-line);
    border-radius:0;
    outline:0;
    font-family:inherit;
    font-size:10px;
    line-height:1.55;
    box-shadow:inset 0 7px 15px rgba(0,0,0,.16);
    transition:
        border-color .2s ease,
        box-shadow .2s ease;
}

.applucp-con textarea{
    min-height:140px;
    resize:vertical;
}

.applucp-con select[multiple]{
    min-height:105px;
}

.applucp-con input:focus,
.applucp-con select:focus,
.applucp-con textarea:focus{
    border-color:var(--eaucp-accent-light);
    box-shadow:
        inset 0 7px 15px rgba(0,0,0,.16),
        0 0 0 3px rgba(117,208,255,.08);
}

.applucp-con select option{
    color:var(--eaucp-text);
    background:var(--eaucp-bg-deep);
}

.applucp-con input[type="checkbox"],
.applucp-con input[type="radio"]{
    width:16px;
    height:16px;
    margin:1px 6px 0 0;
    accent-color:var(--eaucp-accent-light);
    cursor:pointer;
}

/* ==========================================================
   BUTTONBEREICH
   ========================================================== */

.applucp-con__item.applucp-buttons{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:10px;
    margin-top:8px;
    padding:17px;
    background:
        linear-gradient(
            90deg,
            rgba(33,139,208,.1),
            rgba(4,25,43,.9)
        );
    border:1px solid var(--eaucp-line-soft);
}

.applucp-buttons input[type="submit"],
.applucp-buttons input[type="button"],
.applucp-buttons button,
.applucp-buttons a{
    display:flex;
    justify-content:center;
    align-items:center;
    width:100%;
    min-height:42px;
    margin:0;
    padding:10px 14px;
    color:var(--eaucp-bg-deep);
    background:var(--eaucp-accent-light);
    border:1px solid var(--eaucp-accent-light);
    border-radius:0;
    outline:0;
    cursor:pointer;
    font-family:inherit;
    font-size:9px;
    font-weight:800;
    line-height:1.4;
    letter-spacing:1.2px;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    clip-path:polygon(
        10px 0,
        100% 0,
        100% calc(100% - 10px),
        calc(100% - 10px) 100%,
        0 100%,
        0 10px
    );
    transition:
        color .2s ease,
        background .2s ease,
        box-shadow .2s ease;
}

.applucp-buttons input[type="submit"]:hover,
.applucp-buttons input[type="button"]:hover,
.applucp-buttons button:hover,
.applucp-buttons a:hover{
    color:var(--eaucp-accent-light);
    background:var(--eaucp-panel-light);
    box-shadow:0 0 20px rgba(117,208,255,.2);
}

/* ==========================================================
   TABS
   ========================================================== */

.eaapp-page .cat_tabs{
    display:flex;
    flex-wrap:wrap;
    gap:4px;
    margin:0 0 14px;
    padding:6px;
    list-style:none;
    background:rgba(1,9,20,.76);
    border:1px solid var(--eaucp-line-soft);
    border-bottom:2px solid var(--eaucp-accent);
}

.eaapp-page .cat_tabs li{
    position:relative;
    display:block;
    margin:0;
    padding:10px 16px;
    color:var(--eaucp-muted);
    background:rgba(8,43,69,.42);
    border:1px solid transparent;
    cursor:pointer;
    font-size:9px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:1px;
    text-transform:uppercase;
    transition:
        color .2s ease,
        background .2s ease,
        border-color .2s ease;
}

.eaapp-page .cat_tabs li:hover{
    color:var(--eaucp-text);
    background:rgba(33,139,208,.13);
    border-color:var(--eaucp-line-soft);
}

.eaapp-page .cat_tabs li.current{
    color:var(--eaucp-bg-deep);
    background:var(--eaucp-accent-light);
    border-color:var(--eaucp-accent-light);
}

.eaapp-page .con_cat_content{
    display:none;
    padding:15px;
    color:var(--eaucp-text-soft);
    background:
        linear-gradient(
            145deg,
            rgba(1,9,20,.35),
            rgba(8,43,69,.3)
        );
    border:1px solid var(--eaucp-line-soft);
}

.eaapp-page .con_cat_content.current{
    display:block;
}

/* ==========================================================
   HINWEISE AUF DER USER-CP-STARTSEITE
   ========================================================== */

.eaapp-alerts,
.red_alert.eaapp-alerts{
    display:grid;
    gap:10px;
    margin:0;
    padding:0;
    color:inherit;
    background:transparent;
    border:0;
}

.aucp_indexuser,
.eaapp-alert-item{
    position:relative;
    padding:14px 16px 14px 47px;
    color:var(--eaucp-text-soft);
    background:
        linear-gradient(
            90deg,
            rgba(33,139,208,.12),
            rgba(4,25,43,.88)
        );
    border:1px solid var(--eaucp-line-soft);
    font-size:10px;
    line-height:1.65;
}

.aucp_indexuser::before,
.eaapp-alert-item::before{
    content:"";
    position:absolute;
    top:50%;
    left:17px;
    width:11px;
    height:11px;
    background:var(--eaucp-accent-light);
    border:2px solid var(--eaucp-bg-deep);
    box-shadow:
        0 0 0 1px var(--eaucp-accent),
        0 0 10px rgba(117,208,255,.6);
    transform:translateY(-50%) rotate(45deg);
}

/* ==========================================================
   MITGLIEDERLISTEN-FILTER
   ========================================================== */

.bl-filtermemberlist,
.eaapp-filtermemberlist{
    display:grid;
    grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
    gap:10px;
    margin:18px 0;
    padding:15px;
    background:
        linear-gradient(
            145deg,
            rgba(8,43,69,.8),
            rgba(4,25,43,.95)
        );
    border:1px solid var(--eaucp-line-soft);
}

.filterinput{
    position:relative;
    display:grid;
    gap:7px;
    min-width:0;
    padding:11px;
    background:rgba(1,9,20,.34);
    border:1px solid rgba(29,95,143,.2);
}

.filterinput label{
    color:var(--eaucp-muted);
    font-size:9px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:.7px;
    text-transform:uppercase;
}

.filterinput input,
.filterinput select{
    display:block;
    width:100%;
    min-height:38px;
    margin:0;
    padding:8px 10px;
    color:var(--eaucp-text);
    background:var(--eaucp-bg-deep);
    border:1px solid var(--eaucp-line);
    border-radius:0;
    outline:0;
    font-family:inherit;
    font-size:10px;
}

.filterinput input:focus,
.filterinput select:focus{
    border-color:var(--eaucp-accent-light);
    box-shadow:0 0 0 3px rgba(117,208,255,.08);
}

/* ==========================================================
   MODERATIONSÜBERSICHT
   ========================================================== */

.eaapp-mod-sections{
    display:grid;
    gap:20px;
}

.eaapp-mod-section{
    position:relative;
    background:
        linear-gradient(
            145deg,
            rgba(8,43,69,.84),
            rgba(4,25,43,.96)
        );
    border:1px solid var(--eaucp-line-soft);
    overflow:hidden;
}

.eaapp-mod-section::before{
    content:"";
    position:absolute;
    z-index:2;
    top:0;
    left:0;
    width:45px;
    height:2px;
    background:var(--eaucp-accent-light);
    box-shadow:45px 0 0 var(--eaucp-accent);
}

.eaapp-mod-section-head{
    padding:18px 20px;
    color:var(--eaucp-text);
    background:
        linear-gradient(
            90deg,
            rgba(33,139,208,.13),
            transparent
        );
    border-bottom:1px solid var(--eaucp-line-soft);
}

.eaapp-mod-section-head span{
    display:block;
    margin-bottom:4px;
    color:var(--eaucp-muted);
    font-size:9px;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.eaapp-mod-section-head h2{
    margin:0;
    color:var(--eaucp-text);
    font-size:14px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.eaapp-mod-table-wrap{
    width:100%;
    overflow-x:auto;
}

.eaapp-mod-table{
    width:100%;
    min-width:680px;
    border:0;
    border-collapse:collapse;
    border-spacing:0;
}

.eaapp-mod-table th,
.eaapp-mod-table td{
    padding:13px 15px;
    border-right:1px solid rgba(29,95,143,.15);
    border-bottom:1px solid rgba(29,95,143,.18);
    font-size:10px;
    line-height:1.55;
    text-align:left;
    vertical-align:middle;
}

.eaapp-mod-table th:last-child,
.eaapp-mod-table td:last-child{
    border-right:0;
}

.eaapp-mod-table tr:last-child td{
    border-bottom:0;
}

.eaapp-mod-table th,
.aucp-tdhead{
    color:var(--eaucp-muted);
    background:
        linear-gradient(
            180deg,
            rgba(11,49,80,.72),
            rgba(4,25,43,.82)
        );
    font-size:9px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
}

.eaapp-mod-table td{
    color:var(--eaucp-text-soft);
    background:rgba(2,13,24,.34);
}

.eaapp-mod-table tr:hover td{
    background:rgba(33,139,208,.075);
}

.eaapp-mod-table a{
    color:var(--eaucp-accent-light);
}

/* ==========================================================
   WOB-BEREICH IM THREAD
   ========================================================== */

.aucp_showthread-wob{
    display:grid;
    grid-template-columns:repeat(2,minmax(180px,1fr)) auto;
    align-items:end;
    gap:12px;
    margin:14px 0;
    padding:15px;
    color:var(--eaucp-text-soft,#c4d8e4);
    background:
        linear-gradient(
            145deg,
            rgba(8,43,69,.9),
            rgba(4,25,43,.97)
        );
    border:1px solid var(--eaucp-line-soft,rgba(29,95,143,.38));
}

.aucp_showthread-wob__item{
    min-width:0;
}

.aucp_showthread-wob__item:last-child{
    align-self:end;
}

.aucp_showthread-wob label{
    display:block;
    margin-bottom:7px;
    color:var(--eaucp-muted,#8fa9bc);
    font-size:9px;
    font-weight:700;
    line-height:1.4;
    letter-spacing:.8px;
    text-transform:uppercase;
}

.aucp_showthread-wob select{
    display:block;
    width:100%;
    min-height:39px;
    padding:8px 10px;
    color:var(--eaucp-text,#e1f1fa);
    background:var(--eaucp-bg-deep,#010914);
    border:1px solid var(--eaucp-line,#1d5f8f);
    border-radius:0;
    outline:0;
    font-family:inherit;
    font-size:10px;
}

.aucp_showthread-wob select[multiple]{
    min-height:82px;
}

.aucp_showthread-wob input[type="submit"]{
    min-width:155px;
    min-height:41px;
    padding:10px 15px;
    color:var(--eaucp-bg-deep,#010914);
    background:var(--eaucp-accent-light,#75d0ff);
    border:1px solid var(--eaucp-accent-light,#75d0ff);
    cursor:pointer;
    font-family:inherit;
    font-size:9px;
    font-weight:800;
    letter-spacing:1px;
    text-transform:uppercase;
    clip-path:polygon(
        10px 0,
        100% 0,
        100% calc(100% - 10px),
        calc(100% - 10px) 100%,
        0 100%,
        0 10px
    );
}

/* ==========================================================
   PROFIL- UND POSTBITANZEIGE
   ========================================================== */

.aucp_fieldContainer{
    display:grid;
    grid-template-columns:1fr;
    gap:7px;
}

.aucp_fieldContainer__item{
    display:grid;
    grid-template-columns:minmax(120px,35%) minmax(0,1fr);
    align-items:start;
    gap:12px;
    padding:9px 11px;
    color:var(--eaucp-text-soft,#c4d8e4);
    background:rgba(8,43,69,.3);
    border-bottom:1px solid rgba(29,95,143,.18);
    font-size:10px;
    line-height:1.55;
}

.aucp_fieldContainer__item:last-child{
    border-bottom:0;
}

/* ==========================================================
   RESPONSIVE
   ========================================================== */

@media (max-width:760px){

    .eaapp-page .eaucp-body{
        padding:15px;
    }

    .eaapp-panel-head{
        align-items:flex-start;
        flex-direction:column;
    }

    .applucp-con__item.applucp-buttons{
        grid-template-columns:1fr;
    }

    .aucp_showthread-wob{
        grid-template-columns:1fr;
    }

    .aucp_showthread-wob input[type="submit"]{
        width:100%;
    }

    .aucp_fieldContainer__item{
        grid-template-columns:1fr;
        gap:4px;
    }
}