/*
===========================================================
OPSFERA CORE ETALON
ONE ACTIVE DESIGN SYSTEM
===========================================================
*/

:root{
    --ops-bg:#020c17;
    --ops-bg2:#031b2d;

    --ops-panel:#052b45;
    --ops-panel2:#03243a;

    --ops-border:#0b6d99;

    --ops-text:#f4faff;
    --ops-muted:#8faec1;

    --ops-cyan:#25d9ff;
    --ops-green:#1cdd98;
    --ops-amber:#f7b93c;
    --ops-red:#ff5870;
    --ops-purple:#a76cff;
}


/* ===== base ===== */

body.opsfera-core-etalon{
    color:var(--ops-text);

    background:
        radial-gradient(
            circle at 78% 0%,
            rgba(5,94,140,.16),
            transparent 34%
        ),
        linear-gradient(
            180deg,
            var(--ops-bg2),
            var(--ops-bg)
        ) !important;
}


body.opsfera-core-etalon
:is(
    .card,
    .panel,
    .header,
    .glass-card,
    .workspace-panel,
    .content-card,
    .summary-card
){
    border-color:
        rgba(11,109,153,.78) !important;

    background:
        linear-gradient(
            150deg,
            rgba(7,55,82,.95),
            rgba(3,35,57,.98)
        ) !important;

    box-shadow:
        0 14px 35px
        rgba(0,0,0,.20) !important;
}


/* ===== navigation ===== */

body.opsfera-core-etalon
:is(
    .sidebar,
    .sidebar-nav,
    .side-nav,
    .role-nav
){
    background:
        linear-gradient(
            180deg,
            #031a2d,
            #042944
        ) !important;

    border-color:
        rgba(11,109,153,.66) !important;
}


body.opsfera-core-etalon
:is(
    .sidebar a.active,
    .sidebar-nav a.active,
    .side-nav a.active,
    .role-nav a.active,
    [aria-current="page"]
){
    color:#00141d !important;

    border-color:#65eaff !important;

    background:
        linear-gradient(
            90deg,
            #61e9f4,
            #18cde4
        ) !important;

    box-shadow:
        0 0 17px
        rgba(37,217,255,.20) !important;

    font-weight:800 !important;
}


/* ===== default module ===== */

body.opsfera-core-etalon
[data-ops-module="1"]{
    position:relative;

    color:var(--ops-text) !important;

    border:
        1px solid
        rgba(37,217,255,.64) !important;

    background:
        linear-gradient(
            145deg,
            rgba(6,65,97,.82),
            rgba(3,39,62,.96)
        ) !important;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.025),
        0 0 13px
        rgba(37,217,255,.06) !important;
}


/*
 * State colours are ACCENTS.
 * Never solid card paint.
 */

body.opsfera-core-etalon
[data-ops-state="success"]{
    border-color:
        rgba(28,221,152,.86) !important;

    background:
        linear-gradient(
            135deg,
            rgba(28,221,152,.105),
            rgba(3,39,62,.97) 55%
        ) !important;

    box-shadow:
        inset 3px 0 0
        rgba(28,221,152,.84),
        0 0 14px
        rgba(28,221,152,.08) !important;
}


body.opsfera-core-etalon
[data-ops-state="attention"]{
    border-color:
        rgba(247,185,60,.86) !important;

    background:
        linear-gradient(
            135deg,
            rgba(247,185,60,.10),
            rgba(3,39,62,.97) 55%
        ) !important;

    box-shadow:
        inset 3px 0 0
        rgba(247,185,60,.84),
        0 0 14px
        rgba(247,185,60,.08) !important;
}


body.opsfera-core-etalon
[data-ops-state="error"]{
    border-color:
        rgba(255,88,112,.88) !important;

    background:
        linear-gradient(
            135deg,
            rgba(255,88,112,.10),
            rgba(3,39,62,.97) 55%
        ) !important;

    box-shadow:
        inset 3px 0 0
        rgba(255,88,112,.86),
        0 0 14px
        rgba(255,88,112,.08) !important;
}


body.opsfera-core-etalon
[data-ops-state="manual"]{
    border-color:
        rgba(167,108,255,.88) !important;

    background:
        linear-gradient(
            135deg,
            rgba(167,108,255,.105),
            rgba(3,39,62,.97) 55%
        ) !important;

    box-shadow:
        inset 3px 0 0
        rgba(167,108,255,.86),
        0 0 14px
        rgba(167,108,255,.08) !important;
}


/* ===== status chips ===== */

body.opsfera-core-etalon
:is(
    .ops-status,
    .status,
    .badge,
    .pill,
    .chip
){
    border-radius:999px;
}


body.opsfera-core-etalon
:is(
    .ok,
    [data-ops-semantic="success"]
){
    color:#4ceeb9 !important;
    border-color:#1cdd98 !important;
    background:rgba(5,104,74,.54) !important;
}


body.opsfera-core-etalon
:is(
    .warn,
    .warning,
    [data-ops-semantic="attention"]
){
    color:#ffcc67 !important;
    border-color:#f7b93c !important;
    background:rgba(102,70,13,.55) !important;
}


body.opsfera-core-etalon
:is(
    .bad,
    .error,
    .danger,
    [data-ops-semantic="error"]
){
    color:#ff8b9a !important;
    border-color:#ff5870 !important;
    background:rgba(110,27,42,.56) !important;
}


body.opsfera-core-etalon
:is(
    .manual-change,
    .partial,
    [data-ops-semantic="manual"]
){
    color:#d2b0ff !important;
    border-color:#a76cff !important;
    background:rgba(72,40,132,.58) !important;
}


/* ===== buttons ===== */

body.opsfera-core-etalon
:is(
    .btn,
    button
){
    color:#eaf8ff;

    border-color:
        rgba(11,109,153,.82);

    background:
        linear-gradient(
            180deg,
            rgba(7,64,97,.97),
            rgba(4,44,69,.98)
        );
}


body.opsfera-core-etalon
:is(
    .btn.primary,
    button.primary
){
    color:#fff !important;

    border-color:
        var(--ops-cyan) !important;

    background:
        linear-gradient(
            180deg,
            #159ce6,
            #0874c5
        ) !important;
}


/* ===== tables ===== */

body.opsfera-core-etalon table{
    color:#e4f0f7 !important;

    background:
        rgba(3,35,56,.50) !important;
}


body.opsfera-core-etalon
table thead th{
    color:#afcbd9 !important;

    background:#07374f !important;

    border-color:
        rgba(11,109,153,.60) !important;
}


/* ===== forms ===== */

body.opsfera-core-etalon
:is(
    input,
    select,
    textarea
){
    color:#eefaff !important;

    border-color:#0875a5 !important;

    background:#052840 !important;

    box-shadow:none;
}


body.opsfera-core-etalon
:is(
    input,
    select,
    textarea
):focus{
    outline:none !important;

    border-color:
        var(--ops-cyan) !important;

    box-shadow:
        0 0 0 2px
        rgba(37,217,255,.10) !important;
}


/* one visible search border */

body.opsfera-core-etalon
:is(
    .ops-search-shell,
    .ops-photo-search,
    .ops-report-search,
    .ops-ts-v3-search,
    [data-ops-search-shell]
)
input{
    border:0 !important;
    outline:0 !important;
    box-shadow:none !important;
    background:transparent !important;
}


/* duplicate hero */

body.opsfera-core-etalon
[data-opsfera-duplicate-hero-hidden="1"]{
    display:none !important;
}


/*
HARD RULES:

1. Base module = navy/cyan.
2. Green/amber/red/purple only from data-ops-state.
3. No JavaScript text guessing.
4. No solid semantic card fills.
5. Status chips may use full semantic colour.
*/

/* OPSFERA_PHOTO_PERIOD_ETALON_V1_START */

/*
Photo archive file cards.
Uses the existing CORE ETALON palette:
navy base + cyan information accent.
*/

body.opsfera-core-etalon
:is(div,article,li):has(
    > .ops-photo-file-etalon-meta
){
    color:#eef8ff !important;

    border:
        1px solid
        rgba(37,217,255,.34)
        !important;

    border-radius:16px !important;

    background:
        linear-gradient(
            145deg,
            rgba(7,54,80,.96),
            rgba(4,36,57,.98)
        )
        !important;

    box-shadow:
        inset 0 1px 0
        rgba(255,255,255,.035),
        0 10px 28px
        rgba(0,0,0,.16)
        !important;
}


body.opsfera-core-etalon
.ops-photo-file-etalon-meta{
    display:grid;

    gap:8px;

    margin:
        0 0 14px;

    color:#eef8ff;
}


body.opsfera-core-etalon
.ops-photo-file-etalon-top{
    display:flex;

    align-items:center;

    justify-content:
        space-between;

    gap:10px;
}


body.opsfera-core-etalon
.ops-photo-file-etalon-category{
    display:inline-flex;

    width:max-content;

    max-width:100%;

    padding:
        5px 9px;

    color:#63e8ff;

    border:
        1px solid
        rgba(37,217,255,.38);

    border-radius:999px;

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

    font-size:11px;

    line-height:1.2;

    font-weight:850;
}


body.opsfera-core-etalon
.ops-photo-file-etalon-name{
    display:block;

    color:#f4fbff;

    font-size:15px;

    line-height:1.3;

    font-weight:850;

    word-break:break-word;
}


body.opsfera-core-etalon
.ops-photo-file-etalon-details{
    display:flex;

    flex-wrap:wrap;

    gap:
        5px
        16px;

    color:#8eb5c9;

    font-size:12px;

    line-height:1.35;
}


body.opsfera-core-etalon
:is(div,article,li):has(
    > .ops-photo-file-etalon-meta
)
.muted{
    color:#8eb5c9 !important;
}


body.opsfera-core-etalon
:is(div,article,li):has(
    > .ops-photo-file-etalon-meta
)
a.btn{
    color:#eafbff !important;

    border:
        1px solid
        rgba(37,217,255,.50)
        !important;

    background:
        linear-gradient(
            180deg,
            rgba(23,157,205,.18),
            rgba(10,93,135,.18)
        )
        !important;

    box-shadow:none !important;
}


body.opsfera-core-etalon
:is(div,article,li):has(
    > .ops-photo-file-etalon-meta
)
a.btn:hover{
    border-color:
        rgba(37,217,255,.82)
        !important;

    background:
        rgba(37,217,255,.13)
        !important;
}


@media(max-width:720px){

    body.opsfera-core-etalon
    .ops-photo-file-etalon-details{
        display:grid;

        gap:4px;
    }
}

/* OPSFERA_PHOTO_PERIOD_ETALON_V1_END */