/* ==================================================
   COLOR PALETTE – DEFAULT – START
   ================================================== */

:root {

--scroll-offset: 60px;

--color_primary:#6C1327;
--color_secondary:#C49669;
--color_secondary_light:#EBD7A8;

--color_text:#1D151A;

--color_background:#F4F1EC;
--color_surface:#FFFFFF;
--color_border:#E2DDD6;

--color_white:#FFFFFF;
--color_black:#000000;

--color_gray_100:#f5f5f5;
--color_gray_200:#e8e8e8;
--color_gray_300:#dcdcdc;
--color_gray_400:#ccc;
--color_gray_500:#bbb;
--color_gray_600:#888;
--color_gray_700:#555;
--color_gray_800:#444;
--color_gray_900:#333;

--color_shadow:rgba(0,0,0,0.2);
--color_shadow_light:rgba(0,0,0,0.1);
--color_overlay:rgba(0,0,0,0.25);

--color_info_bg:#eef3ff;
--color_info_border:#3a66ff;
--color_info_text:#1f2f66;

--color_success_bg:#e6f7ed;
--color_success_border:#2e9b4d;
--color_success_text:#1d5f34;

--color_warning_bg:#fff6e5;
--color_warning_border:#e0a100;
--color_warning_text:#7a5600;

--color_error_bg:#ffe6e6;
--color_error_border:#c40000;
--color_error_text:#7a0000;

--color_flash_success:#2e7d32;
--color_flash_error:#b71c1c;
--color_flash_info:#1565c0;

--color_marker_comment_bg:#1387e0;
--color_marker_comment_border:#e3a5af;
--color_marker_comment_text:#6f7f74;

--color_marker_background_comment:#1e00ff;
--color_marker_background_proposal:#ffb300;
--color_marker_background_ref:#3eea00;
--color_marker_background_relation:#f000dc;
--color_marker_edit:#f40000;

--color_ref_error:#d33;
--color_ref_success:#2c8;

}

/* ==================================================
   COLOR PALETTE – DEFAULT – END
   ================================================== */


/* ==================================================
   COLOR PALETTE – BLUE – START
   ================================================== */

.palette_blue {

--color_primary:#1E3A8A;
--color_secondary:#3B82F6;
--color_secondary_light:#DBEAFE;

--color_text:#0F172A;

--color_background:#F1F5F9;
--color_surface:#FFFFFF;
--color_border:#CBD5E1;

--color_white:#FFFFFF;
--color_black:#000000;

--color_gray_100:#f5f5f5;
--color_gray_200:#e8e8e8;
--color_gray_300:#dcdcdc;
--color_gray_400:#ccc;
--color_gray_500:#bbb;
--color_gray_600:#888;
--color_gray_700:#555;
--color_gray_800:#444;
--color_gray_900:#333;

--color_shadow:rgba(0,0,0,0.2);
--color_shadow_light:rgba(0,0,0,0.1);
--color_overlay:rgba(0,0,0,0.25);

--color_info_bg:#eef3ff;
--color_info_border:#3a66ff;
--color_info_text:#1f2f66;

--color_success_bg:#e6f7ed;
--color_success_border:#2e9b4d;
--color_success_text:#1d5f34;

--color_warning_bg:#fff6e5;
--color_warning_border:#e0a100;
--color_warning_text:#7a5600;

--color_error_bg:#ffe6e6;
--color_error_border:#c40000;
--color_error_text:#7a0000;

--color_flash_success:#2e7d32;
--color_flash_error:#b71c1c;
--color_flash_info:#1565c0;

--color_marker_comment_border:#e3a5af;
--color_marker_comment_text:#6f7f74;

--color_marker_background_comment:#00fff2;
--color_marker_background_proposal:#ffb300;
--color_marker_background_ref:#3eea00;
--color_marker_background_relation:#f000dc;
--color_marker_edit:#f40000;

--color_ref_error:#d33;
--color_ref_success:#2c8;

}

/* ==================================================
   COLOR PALETTE – BLUE – END
   ================================================== */


/* ==================================================
   COLOR PALETTE – GREEN – START
   ================================================== */

.palette_green {

--color_primary:#14532D;
--color_secondary:#22C55E;
--color_secondary_light:#DCFCE7;

--color_text:#052E16;

--color_background:#F0FDF4;
--color_surface:#FFFFFF;
--color_border:#BBF7D0;

--color_white:#FFFFFF;
--color_black:#000000;

--color_gray_100:#f5f5f5;
--color_gray_200:#e8e8e8;
--color_gray_300:#dcdcdc;
--color_gray_400:#ccc;
--color_gray_500:#bbb;
--color_gray_600:#888;
--color_gray_700:#555;
--color_gray_800:#444;
--color_gray_900:#333;

--color_shadow:rgba(0,0,0,0.2);
--color_shadow_light:rgba(0,0,0,0.1);
--color_overlay:rgba(0,0,0,0.25);

--color_info_bg:#eef3ff;
--color_info_border:#3a66ff;
--color_info_text:#1f2f66;

--color_success_bg:#e6f7ed;
--color_success_border:#2e9b4d;
--color_success_text:#1d5f34;

--color_warning_bg:#fff6e5;
--color_warning_border:#e0a100;
--color_warning_text:#7a5600;

--color_error_bg:#ffe6e6;
--color_error_border:#c40000;
--color_error_text:#7a0000;

--color_flash_success:#2e7d32;
--color_flash_error:#b71c1c;
--color_flash_info:#1565c0;

--color_marker_comment_bg:#fff1f4;
--color_marker_comment_border:#e3a5af;
--color_marker_comment_text:#6f7f74;

--color_marker_background_comment:#002aff;
--color_marker_background_proposal:#ffb300;
--color_marker_background_ref:#3eea00;
--color_marker_background_relation:#f000dc;
--color_marker_edit:#f40000;

--color_ref_error:#d33;
--color_ref_success:#2c8;

}

/* ==================================================
   COLOR PALETTE – GREEN – END
   ================================================== */

/* ==================================================
   COLOR PALETTE – RED – START
   ================================================== */

.palette_red {

--color_primary:#7F1D1D;
--color_secondary:#DC2626;
--color_secondary_light:#FEE2E2;

--color_text:#450A0A;

--color_background:#FEF2F2;
--color_surface:#FFFFFF;
--color_border:#FECACA;

--color_white:#FFFFFF;
--color_black:#000000;

--color_gray_100:#f5f5f5;
--color_gray_200:#e8e8e8;
--color_gray_300:#dcdcdc;
--color_gray_400:#ccc;
--color_gray_500:#bbb;
--color_gray_600:#888;
--color_gray_700:#555;
--color_gray_800:#444;
--color_gray_900:#333;

--color_shadow:rgba(0,0,0,0.2);
--color_shadow_light:rgba(0,0,0,0.1);
--color_overlay:rgba(0,0,0,0.25);

--color_info_bg:#fef2f2;
--color_info_border:#dc2626;
--color_info_text:#7f1d1d;

--color_success_bg:#dcfce7;
--color_success_border:#16a34a;
--color_success_text:#14532d;

--color_warning_bg:#fef9c3;
--color_warning_border:#ca8a04;
--color_warning_text:#713f12;

--color_error_bg:#fee2e2;
--color_error_border:#dc2626;
--color_error_text:#7f1d1d;

--color_flash_success:#16a34a;
--color_flash_error:#dc2626;
--color_flash_info:#2563eb;

--color_marker_comment_bg:#fce7f3;
--color_marker_comment_border:#f9a8d4;
--color_marker_comment_text:#831843;

--color_marker_background_comment:#ffb300;
--color_marker_background_proposal:#fb2424;
--color_marker_background_ref:#4ade80;
--color_marker_background_relation:#f472b6;
--color_marker_edit:#ef4444;

--color_ref_error:#dc2626;
--color_ref_success:#22c55e;

}

/* ==================================================
   COLOR PALETTE – RED – END
   ================================================== */


/* ==================================================
   GLOBAL RESET – START
   ================================================== */

* { box-sizing:border-box; }

html {
    height:100%;
    }
    


body {
    min-height:100vh;
    margin:0;
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    background:var(--color_background);
    color:var(--color_text);
    display:flex;
    flex-direction:column;
}

img {
    max-width:100%;
    height:auto;
}

/* ==================================================
   GLOBAL RESET – END
   ================================================== */


/* ==================================================
   HEADER – START
   ================================================== */

.index_header {
    height:50px;
    background:var(--color_primary);
    color:var(--color_white);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 20px;
}

.index_header_logo {
    color:var(--color_white);
    text-decoration:none;
    font-weight:600;
}

.index_header_right {
    display:flex;
    align-items:center;
    gap:10px;
}

.index_user_label {
    font-size:13px;
}

/* ==================================================
   HEADER – END
   ================================================== */


/* ==================================================
   BREADCRUMB – START
   ================================================== */

.index_breadcrumb {
    background:var(--color_secondary_light);
    padding:8px 20px;
    font-size:13px;
    color:var(--color_text);

}


.index_breadcrumb_inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    }
    
.index_breadcrumb_admin{
display:flex;
align-items:center;
gap:8px;
}

/* sticky breadcrumb */

#index_breadcrumb{
position:sticky;
top:0;
z-index:200;
background:var(--color_secondary_light);
border-bottom:1px solid var(--color_border);
}

.index_breadcrumb a {
    text-decoration:none;
    color:var(--color_primary);
}

.index_breadcrumb_sep {
    margin:0 6px;
    opacity:0.6;
}

.index_breadcrumb_module {
    font-weight:600;
}

.index_breadcrumb_view {
    opacity:0.8;
}

/* ==================================================
   BREADCRUMB – END
   ================================================== */


/* ==================================================
   LAYOUT BASE – START
   ================================================== */

.index_layout {
    display:grid;
    grid-template-columns:360px 1fr;
    flex:1;
}

/* ==================================================
   LAYOUT BASE – END
   ================================================== */


/* ==================================================
   LAYOUT FULL MODE – START
   ================================================== */

.index_layout_full {
    display:block;
}

/* ==================================================
   LAYOUT FULL MODE – END
   ================================================== */


/* ==================================================
   SIDEBAR – START
   ================================================== */

.index_sidebar {
    background:var(--color_text);
    color:var(--color_white);
    padding:20px;
    min-height:100%;
    height:fit-content;
}

.index_sidebar_sticky {
    position: sticky;
    top: 50px;
    max-height: calc(100vh - 60px);
    overflow-y: auto;
}

.index_sidebar h2 {
    margin-top:0;
    font-size:18px;
    margin-bottom:20px;
}

.index_sidebar ul {
    list-style:none;
    padding:0;
    margin:0;
}

.index_sidebar li {
    margin-bottom:8px;
}

.index_sidebar a {
    color:var(--color_secondary_light);
    text-decoration:none;
    font-size:14px;
}

.index_sidebar a:hover {
    text-decoration:underline;
}

/* ==================================================
   SIDEBAR – END
   ================================================== */


/* ==================================================
   CONTENT WRAPPER – START
   ================================================== */

.index_content_wrapper {
    width:100%;
}

/* ==================================================
   CONTENT WRAPPER – END
   ================================================== */


/* ==================================================
   CONTENT – START
   ================================================== */

.index_content {
    width:100%;
    padding:40px;
    background:var(--color_surface);
    min-height:100%;
    scroll-margin-top: var(--scroll-offset);
}

/* ==================================================
   CONTENT – END
   ================================================== */


/* ==================================================
   CONTENT WIDTH NORMAL – START
   ================================================== */

.index_layout_width_normal .index_content {
    max-width:1100px;
    margin:auto;

}

/* ==================================================
   CONTENT WIDTH NORMAL – END
   ================================================== */


/* ==================================================
   CONTENT WIDTH WIDE – START
   ================================================== */

.index_layout_width_wide .index_content {
    max-width:1400px;
    margin:auto;
    /* border: 1px solid red; */
}


/* ==================================================
   CONTENT WIDTH WIDE – END
   ================================================== */


/* ==================================================
   BUTTONS – START
   ================================================== */

.index_btn_primary {
    padding:8px 16px;
    background:var(--color_primary);
    color:var(--color_white);
    border:none;
    border-radius:6px;
    cursor:pointer;
}

.index_btn_primary:hover {
    opacity:0.9;
}

.index_btn_secondary {
    display:inline-block;
    padding:6px 12px;
    background:var(--color_surface);
    border:1px solid var(--color_border);
    border-radius:6px;
    font-size:13px;
    color:var(--color_text);
    text-decoration:none;
    cursor:pointer;
}

.index_btn_secondary:hover {
    background:var(--color_secondary_light);
}

/* ==================================================
   BUTTONS – END
   ================================================== */


/* ==================================================
   FORMS – START
   ================================================== */

input[type="text"],
input[type="password"],
textarea,
select {
    border:1px solid var(--color_border);
    border-radius:6px;
    padding:6px 8px;
    font-size:14px;
}

textarea { width:100%; }

/* ==================================================
   FORMS – END
   ================================================== */


/* ==================================================
   FOOTER – START
   ================================================== */

.index_footer {
    padding:14px 20px;
    font-size:12px;
    color:var(--color_text);
    background:var(--color_secondary_light);
}

.index_footer_inner {
    max-width:1200px;
    margin:auto;
    opacity:0.85;
}

/* ==================================================
   FOOTER – END
   ================================================== */

   /* ==================================================
   SITE TREE – START
   ================================================== */

.site_tree {
    list-style:none;
    padding-left:10px;
    margin-top:20px;
    font-size:14px;
}

.site_tree ul {
    list-style:none;
    padding-left:22px;
    margin-top:6px;
    position:relative;
}

.site_tree ul::before {
    content:"";
    position:absolute;
    left:8px;
    top:0;
    bottom:0;
    width:1px;
    background:var(--color_border);
}

.site_tree li {
    position:relative;
    padding-left:14px;
    margin:6px 0;
}

.site_tree li::before {
    content:"";
    position:absolute;
    left:0;
    top:10px;
    width:8px;
    height:1px;
    background:var(--color_border);
}

.tree_module {
    font-weight:600;
    color:var(--color_primary);
}

.tree_section {
    text-decoration:none;
    color:var(--color_text);
}

.tree_section:hover {
    text-decoration:underline;
}

.tree_param {
    font-size:12px;
    margin-left:6px;
    opacity:0.6;
}

/* ==================================================
   SITE TREE – END
   ================================================== */

   /* ==================================================
   HOME TILE ICON – START
   ================================================== */

.home_tile {
    position:relative;
}

.home_tile_icon {

    position:absolute;
    top:14px;
    right:14px;

    width:30px;
    height:30px;

    opacity:0.6;

}

/* ==================================================
   HOME TILE ICON – END
   ================================================== */

   /* ==================================================
   LOGIN FORM – START
   ================================================== */

.index_login_form {

display:flex;
gap:6px;
align-items:center;

}

.index_login_form input {

height:28px;
font-size:13px;

}

/* ==================================================
   LOGIN FORM – END
   ================================================== */

   /* ==================================================
   FLASH MESSAGE SYSTEM – START
   ================================================== */
   
   .index_flash{
   padding:12px 16px;
   margin:12px 0;
   border-left:4px solid;
   font-weight:500;
   border-radius:3px;
   }
   
   /* INFO */
    
    .index_flash_info{
    background:var(--color_info_bg);
    border-color:var(--color_info_border);
    color:var(--color_info_text);
    }
    
    /* SUCCESS */
    
    .index_flash_success{
    background:var(--color_success_bg);
    border-color:var(--color_success_border);
    color:var(--color_success_text);
    }
    
    /* WARNING */
    
    .index_flash_warning{
   background:var(--color_warning_bg);
   border-color:var(--color_warning_border);
   color:var(--color_warning_text);
   }
   
   /* ERROR */
   
   .index_flash_error{
   background:var(--color_error_bg);
   border-color:var(--color_error_border);
   color:var(--color_error_text);
   }
   
   /* ==================================================
   FLASH MESSAGE SYSTEM – END
   ================================================== */


   /* ==================================================
   TABLE ENGINE – GLOBAL START
   ================================================== */

.table_engine {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
}

/* --------------------------------------------------
   KOMÓRKI
-------------------------------------------------- */

.table_engine th,
.table_engine td {
    border: 1px solid var(--color_gray_300);
    padding: 6px 10px;
    text-align: left;
    vertical-align: middle;
}

/* --------------------------------------------------
   NAGŁÓWKI
-------------------------------------------------- */

.table_engine th {
    background-color: var(--color_gray_100);
    font-weight: 600;
    white-space: nowrap;
}

/* --------------------------------------------------
   SORTOWANIE
-------------------------------------------------- */

.table_engine th.table_engine_sortable a {
    color: inherit;
    text-decoration: none;
    display: inline-block;
}

.table_engine th.table_engine_sortable a:hover {
    text-decoration: underline;
}

/* --------------------------------------------------
   WIERSZE
-------------------------------------------------- */

.table_engine tr:nth-child(even) {
    background-color: var(--color_surface);
}

.table_engine tr:hover {
    background-color: var(--color_info_bg);
}

/* --------------------------------------------------
   TRYB EDYCJI
-------------------------------------------------- */

.table_engine tr.editing {
    background-color: var(--color_warning_bg);
}

/* --------------------------------------------------
   INPUT INLINE
-------------------------------------------------- */

.table_engine .table_engine_inline_input {
    width: 100%;
    box-sizing: border-box;
    padding: 4px 6px;
    font-size: 13px;
}

/* --------------------------------------------------
   KOLUMNA EDYCJI
-------------------------------------------------- */

.table_engine_edit_column {
    white-space: nowrap;
    width: 100px;
    min-width: 100px;
}

/* --------------------------------------------------
   PRZYCISKI
-------------------------------------------------- */

.table_engine button {
    font-size: 12px;
    padding: 3px 8px;
    cursor: pointer;
}

.table_engine_inline_save_btn {
    background-color: var(--color_flash_success);
    color: var(--color_white);
    border: none;
}

.table_engine_inline_cancel_btn {
    background-color: var(--color_flash_error);
    color: var(--color_white);
    border: none;
}

.table_engine_edit_btn {
    background-color: var(--color_flash_info);
    color: var(--color_white);
    border: none;
}

/* --------------------------------------------------
   KOLUMNY NUMERYCZNE (opcjonalnie)
-------------------------------------------------- */

.table_engine .table_engine_cell_numeric {
    text-align: right;
}

/* ==================================================
   TABLE ENGINE – GLOBAL END
   ================================================== */

   /* ==================================================
   TABLE ENGINE – TOOLBAR START
   ================================================== */

.table_engine_toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;

    margin-bottom: 10px;
}

/* --------------------------------------------------
   LEWA / PRAWA SEKCJA (opcjonalnie)
-------------------------------------------------- */

.table_engine_toolbar_left {
    display: flex;
    gap: 8px;
}

.table_engine_toolbar_right {
    display: flex;
    gap: 8px;
}

/* --------------------------------------------------
   PRZYCISKI
-------------------------------------------------- */

.table_engine_toolbar button,
.table_engine_toolbar a {
    font-size: 13px;
    padding: 5px 10px;

    border: 1px solid var(--color_gray_400);
    background: var(--color_gray_100);

    text-decoration: none;
    color: var(--color_gray_900);

    cursor: pointer;
}

.table_engine_toolbar button:hover,
.table_engine_toolbar a:hover {
    background: var(--color_gray_200);
}

/* --------------------------------------------------
   PRZYCISK GŁÓWNY (np. apply)
-------------------------------------------------- */

.table_engine_toolbar button[type="submit"] {
    background: var(--color_flash_info);
    color: var(--color_white);
    border-color: var(--color_flash_info);
}

.table_engine_toolbar button[type="submit"]:hover {
    background: var(--color_primary);
}

/* --------------------------------------------------
   RESET (link)
-------------------------------------------------- */

.table_engine_toolbar a {
    display: inline-block;
}

/* ==================================================
   TABLE ENGINE – TOOLBAR END
   ================================================== */

   /* ==================================================
   TABLE ENGINE – DATASOURCE BAR START
   ================================================== */

   .table_engine_datasource{
    font-size: 12px;
    color: var(--color_gray_700);
    margin-bottom: 10px;
    padding: 4px 8px;
    background: var(--color_gray_100);
    border-radius: 4px;
    display: inline-block;
}

.table_engine_ds_name{
    font-weight: 600;
    color: var(--color_gray_800);
}

.table_engine_ds_path{
    font-family: monospace;
    color: var(--color_gray_600);
}

/* ==================================================
   TABLE ENGINE – DATASOURCE BAR END
   ================================================== */

/* ==================================================
   HASH ANCHOR FLASH – START
   ================================================== */

.hash_flash {
    animation: hash_flash_anim 2s ease-out;
}

@keyframes hash_flash_anim {
    0% {
        background-color: #fff3cd;
        outline: 3px solid #ffc107;
    }
    100% {
        background-color: transparent;
        outline: none;
    }
}

/* ==================================================
   HASH ANCHOR FLASH – END
   ================================================== */

/* ==================================================
   OFFLINE BANNER – START
   ================================================== */

.index_offline_banner {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-top: 12px;
    margin-bottom: 12px;
    background: #fff3cd;
    border: 1px solid #ffc107;
    border-radius: 6px;
    color: #856404;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.index_offline_banner svg {
    flex-shrink: 0;
}

/* ==================================================
   OFFLINE BANNER – END
   ================================================== */

/* ==================================================
   MAINTENANCE BANNER – START
   ================================================== */

.index_maintenance_banner {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    margin-top: 12px;
    margin-bottom: 12px;
    background: #f8d7da;
    border: 1px solid #f5c6cb;
    border-radius: 6px;
    color: #721c24;
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.index_maintenance_banner svg {
    flex-shrink: 0;
}

/* ==================================================
   MAINTENANCE BANNER – END
   ================================================== */