/* Vizuální vrstva obrazovek Orqana Control.
 *
 * Nákladový systém, Investoři, Zákazníci, Dokumenty a Pohledávky nestojí na
 * vlastním designu, ale na stejných třídách (.control-hero, .acc-card,
 * .issues.compact, .pay-blocks, .store-form). Předělat je proto znamená
 * předělat tuhle vrstvu, ne pět šablon zvlášť: jinak se za měsíc rozejdou
 * a bude to vypadat jako pět různých produktů.
 *
 * Načítá se za style.css, takže tady stačí přebít to, co drhne. Pravidla
 * mají stejnou nebo vyšší specifičnost, ne !important -- to by rozbilo
 * odchylky, které jednotlivé obrazovky vědomě mají.
 */

/* --- hlavička obrazovky -------------------------------------------------- */
/* Titulek, jedna věta co obrazovka dělá, a vpravo číslo, kvůli kterému tam
   člověk chodí. Dřív se to slévalo do jednoho odstavce. */
.control-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 1.2rem;
    margin: 0 0 1.1rem;
    padding: 1.15rem 1.35rem;
    border: 1px solid #e6e8f0;
    border-radius: 16px;
    background:
        radial-gradient(120% 140% at 0% 0%, #f6f6ff 0%, rgba(246,246,255,0) 60%),
        #fff;
    box-shadow: 0 1px 2px rgba(20, 27, 48, .03);
}
.control-hero > div { min-width: 0; }
.control-hero .eyebrow {
    display: block;
    margin-bottom: .3rem;
    color: #7c7ee0;
    font-size: .56rem;
    font-weight: 600;
    letter-spacing: .12em;
}
.control-hero h1 { margin: 0 0 .3rem; font-size: 1.42rem; letter-spacing: -.02em; }
.control-hero p { max-width: 74ch; margin: 0; color: #6b7285; font-size: .71rem; line-height: 1.6; }
.control-hero form { margin: 0; }

.acc-chip {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    padding: .34rem .7rem;
    border: 1px solid #e1e4ee;
    border-radius: 999px;
    background: #fff;
    color: #4d5567;
    font-size: .63rem;
    font-weight: 500;
    white-space: nowrap;
}
.acc-chip.ok { border-color: #cfe8d8; background: #f4fbf7; color: #2f7d4f; }

/* --- sekce -------------------------------------------------------------- */
/* Karta má jeden rytmus: nadřazený štítek, titulek, vysvětlení, akce vpravo.
   Bez toho každá sekce začínala jinak a stránka vypadala jako slepenec. */
.acc-card {
    padding: 0;
    border: 1px solid #e6e8f0;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(20, 27, 48, .03);
    overflow: hidden;
}
.acc-card + .acc-card { margin-top: .7rem; }
.acc-card > header,
.acc-card > .acc-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: .9rem;
    padding: .95rem 1.25rem;
    border-bottom: 1px solid #f0f1f6;
    background: #fcfcfe;
}
.acc-card > header .eyebrow,
.acc-card > .acc-head .eyebrow {
    display: block;
    margin-bottom: .2rem;
    color: #9098a8;
    font-size: .54rem;
    font-weight: 600;
    letter-spacing: .1em;
}
.acc-card > header h2,
.acc-card > .acc-head h2 { margin: 0; font-size: .95rem; letter-spacing: -.01em; }
.acc-card > header p,
.acc-card > .acc-head p { max-width: 76ch; margin: .25rem 0 0; color: #6b7285; font-size: .68rem; line-height: 1.55; }
.acc-card > header form { margin: 0; }
.acc-card > .store-form,
.acc-card > .pay-blocks,
.acc-card > .pay-lines,
.acc-card > p,
.acc-card > ol,
.acc-card > ul,
.acc-card > .plugin-toggle,
.acc-card > .store-item-actions { margin-left: 1.25rem; margin-right: 1.25rem; }
.acc-card > p:last-child,
.acc-card > .store-form:last-child { margin-bottom: 1.1rem; }
.acc-card > .store-form { margin-top: 1rem; }
.acc-card > .plugin-toggle,
.acc-card > .store-item-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .5rem;
    margin-top: .9rem;
    margin-bottom: 1.1rem;
}
.acc-card > .plugin-toggle small { color: #8a93a5; font-size: .6rem; }

/* --- tabulky ------------------------------------------------------------ */
/* Data na plnou šířku karty, hlavička tichá, čísla čitelná. Na malém okně
   se tabulka posouvá, místo aby rozhodila celou stránku. */
.acc-card table.issues,
.acc-card table.table {
    display: block;
    width: 100%;
    overflow-x: auto;
    border-collapse: collapse;
    white-space: nowrap;
}
.acc-card table.issues thead th {
    padding: .55rem 1.25rem;
    border-bottom: 1px solid #eef0f5;
    color: #9098a8;
    font-size: .55rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    text-align: left;
    background: #fff;
}
.acc-card table.issues tbody td {
    padding: .7rem 1.25rem;
    border-bottom: 1px solid #f4f5f9;
    color: #4d5567;
    font-size: .69rem;
    vertical-align: middle;
}
.acc-card table.issues tbody tr:last-child td { border-bottom: 0; }
.acc-card table.issues tbody tr:hover td { background: #fcfcff; }
.acc-card table.issues tbody strong { color: #2c3244; font-weight: 600; }
.acc-card table.issues tbody small { color: #8a93a5; font-size: .59rem; }
.acc-card table.issues tfoot th {
    padding: .6rem 1.25rem;
    border-top: 1px solid #eef0f5;
    color: #394256;
    font-size: .66rem;
    text-align: left;
    background: #fafbfd;
}

/* --- prázdné stavy ------------------------------------------------------ */
/* „Nikdo nic nedluží" je dobrá zpráva a má tak vypadat, ne jako chybějící obsah. */
.acc-card > p.muted.small,
.control-empty {
    margin: 1rem 1.25rem 1.15rem;
    padding: .85rem 1rem;
    border: 1px dashed #e2e5ee;
    border-radius: 12px;
    color: #78808f;
    font-size: .66rem;
    line-height: 1.55;
    background: #fcfcfd;
}

/* --- záložky ------------------------------------------------------------ */
.control-tabs {
    display: flex;
    flex-wrap: wrap;
    gap: .25rem;
    margin: 0 0 1rem;
    padding: .25rem;
    border: 1px solid #e6e8f0;
    border-radius: 12px;
    background: #f7f8fb;
}
.control-tabs a {
    padding: .4rem .8rem;
    border-radius: 9px;
    color: #667085;
    font-size: .68rem;
    font-weight: 500;
    text-decoration: none;
}
.control-tabs a:hover { color: #4a4bd0; background: #fff; }
.control-tabs a.active { color: #3d3fc4; background: #fff; box-shadow: 0 1px 2px rgba(20,27,48,.06); }

/* --- detaily a formuláře v kartě ---------------------------------------- */
.acc-card .store-tech,
.acc-card .store-config { margin: 0 1.25rem 1rem; }
.acc-card .store-tech summary,
.acc-card .store-config summary {
    padding: .4rem 0;
    color: #5b5ce2;
    font-size: .66rem;
    font-weight: 500;
    cursor: pointer;
}
.acc-card details[open] > summary { margin-bottom: .5rem; }

/* Tlačítka v řádku tabulky nemají roztahovat řádek do dvou. */
.acc-card table.issues .store-item-actions {
    flex-direction: row;
    align-items: center;
    gap: .3rem;
    margin: 0;
}
.acc-card table.issues .store-item-actions form { margin: 0; }

@media (max-width: 760px) {
    .control-hero { padding: 1rem 1.1rem; }
    .control-hero h1 { font-size: 1.2rem; }
    .acc-card > header,
    .acc-card > .acc-head { padding: .85rem 1rem; }
    .acc-card table.issues thead th,
    .acc-card table.issues tbody td { padding-left: 1rem; padding-right: 1rem; }
    .acc-card > .store-form,
    .acc-card > .pay-blocks,
    .acc-card > p { margin-left: 1rem; margin-right: 1rem; }
}