* {margin:0; padding:0;}

body {overflow-x:hidden; font-family: 'Segoe UI', system-ui, sans-serif; background: #fff; font-size:15px; background: #dddddd;}

.header {top: 0; z-index: 13; border-top: 1px solid black; background: #ddd; position: sticky;}

button {padding:8px 15px; margin:0 5px; border:none; cursor: pointer; font-family: 'Segoe UI', system-ui, sans-serif; background: none;}


.bg_video {height: 450px; position: absolute; top: 270px; left: 0; width: 100%;
    /* Определяем, что все другие элементы на странице будут поверх видео */ z-index: -10;}



.enter { width:100%; max-width:346px; margin: 10px auto; }
.enter form { width:320px; margin:0 auto; background:#ffffff78; padding:20px 10px; border:2px solid #000; }
.enter h2 { font-size:16px; text-align:center; background:#50a93b; color:#fff; padding:14px; width:270px; margin:0 auto; font-weight:500; background:linear-gradient(135deg, #81c081 0%, #35a247 100%); }
.enter h3 { color:#000; font-size:16px; font-weight:500; letter-spacing:-1px; margin:8px 0 4px 0; text-align:center; }

.enter input { width:290px; margin:10px auto; padding:12px; border:1.5px solid #ccc; font-size:14px; transition:all 0.15s; background:#fff; display:block; outline:none; box-sizing:border-box; }

.enter input:focus { outline:none; border-color:#000; background:#fafafa; }
.enter input[type="submit"] { width:290px; margin:10px auto; padding:14px; background:#000000d4; color:#fff; border:1.5px solid #000; cursor:pointer; transition:all 0.2s; opacity:1; }
.enter input[type="submit"]:hover { background:#fff; color:#000; }

    .pass_new {position:relative; width:290px; margin:0 auto; }

    .pass_eye { width:20px; height:20px; position:absolute; top:50%; right:20px; transform:translateY(-50%); display:inline-block; opacity:0.6; background:url(../images/view.svg) 0 0 no-repeat; background-size:contain; cursor:pointer; }
    .pass_eye.hide { background:url(../images/no-view.svg) 0 0 no-repeat; background-size:contain; }
    .pass_eye:hover { opacity:1; }

    .captcha-container { width: 286px; margin:10px auto; text-align:center; border-radius:0; }

    #captcha-widget { transform:scale(0.95); transform-origin:top left; border-radius:0; margin:0 auto; }
    #refresh-captcha { background:#4e8ef5; color:#fff; padding:8px 15px; cursor:pointer; height:auto; transition:all 0.2s; margin-top:5px; }
    #refresh-captcha:hover { background:#fff; color:#000; }

    .bg_video {height: 450px; position: absolute; top: 250px; left: 0; width: 100%; z-index: -10;}








/*
.user_block span {font-size: 11px; display: inline; padding:0 5px;}
*/


.users_panel {background:linear-gradient(to right, rgba(255,255,255,1) 0%, rgba(221,221,221, 1) 50%); position: relative;}


.user_block {display:inline-block; width: 700px; margin:0 20px 0 10px;}
.user_block img {vertical-align: top;}
.user_block > p a {color: #c7c7c7;}


.users_online {display:inline;}


summary {width:300px; display:inline-flex; justify-content:space-between; align-items: center; position:relative; min-height:40px; padding:0 20px 0 40px; background:#fff; border-radius:0 0 8px 0;}
summary::after {width:40px; height:40px; background:#add5aa; content:"+"; color:#fff; font-size:26px; text-align:center; position:absolute; top:0; left: -10px; border-radius: 0 0 0 8px;}
details[open] summary::after {content:"-"; background:#9c6e9a;}

details {display:inline;}

.spoiler_brands summary span {color: #ccc;}
.spoiler_brands details div {background:rgb(255, 255, 255, .5); width:350px; margin:0 10px;}

.online_users {color: #add5aa;}

.user_links {width:1882px; background:#a5a5a5; margin-top: 1px; position:sticky; padding: 5px 0 2px 8px;}
/*
.user_links {display: flex;}
*/
.user_links > div {margin: 5px; display:inline-block;}




.offline {color:#999; font-size:0.9em;}

.info_btn {display:inline-block; width:20px; height:40px; line-height:40px; text-align:center; border: 1px solid #c3c3c37d; color:white; text-decoration:none;
font-size: 22px; vertical-align: top;}

.overlay {position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.5);z-index:10;display:none;}

.info_panel {position:fixed;top:50%;right:-500px;transform:translateY(-50%);width:500px;height:500px;background:#ededed;
    z-index:11;transition:right 0.3s ease;box-shadow:-2px 0 10px rgba(0,0,0,0.1);}

.close_btn {position:absolute;top:10px;right:10px;width:30px;height:30px;background:#e98181;color:white;border-radius:50%;
    border:none;font-size:20px;line-height:30px;cursor:pointer; padding: 0;}


.user a {text-decoration: underline;}

.user_link {display:inline-block; padding:8px 20px; text-decoration:none; border-radius: 6px; background: #fff; box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: all 0.3s ease; overflow: hidden; line-height: 22px; text-align: center;}

.user_link:hover {transform: translateY(-2px); box-shadow: 0 5px 15px rgba(0,0,0,0.1); background: -webkit-linear-gradient(#fff, #f4f4f4); }
.user_link:hover::after {opacity: 1;}
.user_link::after {content: ''; position: absolute; bottom: 0;/* left: var(--cursor-x, 50%);*/ width: 30px; height: 3px; background: #677fa9; transform: translateX(-50%);
    border-radius: 3px 3px 0 0; opacity: 0; transition: opacity 0.3s ease, left 0.1s linear;}

.user_link .online {color: #fff; background: #adddb2;}
.user_link .offline {color: #d9d9d9;}

.impersonation-warning {padding:10px 13px; color: #fff; display: inline; position: absolute; right: 33px; top:0; background:#e7a0a0; border-radius:0 0 8px 8px;}
.impersonation-warning a {text-decoration: underline;}


/*

.alphabet-nav {display:flex; flex-wrap:wrap; gap:5px; margin-bottom:20px; padding:10px; background:#f5f5f5; border-radius:5px}
.alphabet-nav a {display:inline-block; padding:5px 10px; background:#fff; border:1px solid #ddd; border-radius:3px; text-decoration:none; color:#0073aa; font-weight:bold}
.alphabet-nav a:hover {background:#0073aa; color:#fff}
.alphabet-grid {display:grid; grid-template-columns:repeat(auto-fill,minmax(250px,1fr)); gap:20px}
.letter-block {break-inside:avoid}

 */

/* МЕНЮ КАТЕГОРИЙ */
.menu_block {display: flex; position: relative; margin:10px 33px 10px 13px;}
.menu {width:100%; overflow: hidden; transition: all 0.4s ease; max-height: 500px; opacity: 1; padding:8px; border-radius:10px; background: #fff;}


.menu a {text-decoration: none; transition: all 0.3s; display: inline-block; font-size: 14px; font-weight: 500; margin:2px 4px;
    padding: 10px 19px;  color: #444; background: linear-gradient(135deg, #f1f0f0 0%, #dfe2e5 100%); vertical-align: middle;
    border-radius: 8px; box-shadow: 0 3px 10px rgba(0,0,0,0.05); border: 1px solid #e0e0e0; position: relative; /*overflow: hidden;*/}

.menu > span {display:inline-block; position: relative; width: 24px; height: 30px; background: #aaa; line-height: 30px; text-align: center; font-size: 18px; margin:7px 5px;
    color: #fff; vertical-align: top;}

.menu a:hover {background: linear-gradient(135deg, #ffffff 0%, #f1f3f4 100%); box-shadow: 0 5px 15px rgba(0,0,0,0.08); transform: translateY(-2px); color: #2c3e50;}
.menu a:hover span {opacity: 1;}

.menu a.menu_active {background: linear-gradient(135deg, #3498db 0%, #2980b9 100%); color: white; box-shadow: 0 2px 10px rgba(52, 152, 219, 0.3); border-color: #2980b9;}
.menu a.menu_active span {opacity: 1;}

.menu .menu_active:before {content: ''; position: absolute; top: -5px; left: -5px; right: -5px; bottom: -5px; background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
    border-radius: 12px; z-index: -1;}

.menu .a_break {display: block; width: 100%; height: 0; padding: 0; margin: 0;}


.count_action, .count_errors {vertical-align:sub; font-size: 11px; position: absolute; left:-4px; background: #dcc96f; text-align: center; border-radius:10px; top:-8px; color: #fff;
    padding: 1px 6px; z-index: 11; opacity:.3;}

.count_errors {left: auto; right: -4px; background: #d99999;}





/*
.menu_block {
    display: flex;
    position: relative;
    margin: 10px 33px 10px 13px;
}

.menu {
    width: 100%;
    overflow: hidden;
    transition: all 0.4s ease;
    max-height: 500px;
    opacity: 1;
    padding: 8px;
    border-radius: 10px;
    background: #fff;
}


.letter-section {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.letter-header {
    display: inline-flex;
    width: 28px;
    height: 28px;
    background: #aaa;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    color: white;
    font-size: 16px;
    font-weight: bold;
    margin: 2px 4px;
}


.menu a {
    text-decoration: none;
    transition: all 0.3s;
    display: inline-flex;
    align-items: center;
    font-size: 14px;
    font-weight: 500;
    margin: 2px 4px;
    padding: 10px 19px;
    color: #444;
    background: linear-gradient(135deg, #f1f0f0 0%, #dfe2e5 100%);
    vertical-align: middle;
    border-radius: 8px;
    box-shadow: 0 3px 10px rgba(0,0,0,0.05);
    border: 1px solid #e0e0e0;
    position: relative;
}

.menu a:hover {
    background: linear-gradient(135deg, #ffffff 0%, #f1f3f4 100%);
    box-shadow: 0 5px 15px rgba(0,0,0,0.08);
    transform: translateY(-2px);
    color: #2c3e50;
}

.menu a.menu_active {
    background: linear-gradient(135deg, #3498db 0%, #2980b9 100%);
    color: white;
    box-shadow: 0 2px 10px rgba(52, 152, 219, 0.3);
    border-color: #2980b9;
}


.count_errors,
.count_action {
    position: absolute;
    top: -8px;
    font-size: 11px;
    padding: 1px 6px;
    border-radius: 10px;
    color: white;
    z-index: 11111;
}

.count_errors {
    right: -4px;
    background: #d99999d6;
}

.count_action {
    left: -4px;
    background: #dcc96fd9;
}


.menu-text {
    display: inline-block;
}


#menu_toggle {
    display: none;
}

*/


.top_block {display:flex; width:960px; justify-content:space-between;}
.top_block > div .count_remove {width:20px; height:20px; display:inline-block; vertical-align:sub;}
.top_block > div p {display:inline-block;}



#menu_toggle, #menu_brands {display:none;}

.toggle_btn, .toggle_brands {width: 20px; height: 52px; background: #3191d1; color: white; border: none; border-radius: 0 8px 8px 0; cursor: pointer; display: flex;
    align-items: center; justify-content: center; transition: all 0.3s; z-index: 10; box-shadow: 2px 0 5px rgba(0,0,0,0.2); right: -20px; top: 5px; position: absolute;}
.toggle_btn:hover, .toggle_brands:hover {transform: translateY(-2px); border-color: #fff;}

#menu_toggle:checked ~ .menu_block .toggle_btn {border-color: #fff;}

#menu_toggle:checked ~ .menu_block .menu {max-height: 0; opacity: 1; padding: 0 25px; margin: 0;}
.toggle_btn::after {content: "❮"; font-size:14px; font-weight:bold; line-height: 1;}
#menu_toggle:checked ~ .menu_block .toggle_btn {transform: rotate(180deg); top: -37px; right: -33px;}


.toggle_brands {background: #000; right:13px;}
.toggle_brands:hover {transform: translateY(-2px); border-color: #fff;}



#menu_brands:checked ~ .middle .toggle_brands {border-color: #fff;}

#menu_brands:checked ~ .middle .middle_parent {max-height: 0; opacity: 0; padding: 0 25px; margin: 0;}
.toggle_brands::after {content: "❮"; font-size:14px; font-weight:bold; line-height: 1;}
#menu_brands:checked ~ .middle .toggle_brands {transform: rotate(180deg); right: 0;}


/*
#menu_toggle, #menu_brands {display:none;}

.toggle_btn, .toggle_brands {width: 20px; height: 52px; background: #3191d1; color: white; border: none; border-radius: 0 8px 8px 0; cursor: pointer; display: flex;
 align-items: center; justify-content: center; transition: all 0.3s; z-index: 100; box-shadow: 2px 0 5px rgba(0,0,0,0.2); right: -20px; top: 5px; position: absolute;}
.toggle_btn:hover, .toggle_brands:hover {transform: translateY(-2px); border-color: #fff;}

#menu_toggle:checked ~ .menu_block .toggle_btn {border-color: #fff;}

#menu_toggle:checked ~ .menu_block .menu {max-height: 0; opacity: 1; padding: 0 25px; margin: 0;}
.toggle_btn::after {content: "❮"; font-size:14px; font-weight:bold; line-height: 1;}
#menu_toggle:checked ~ .menu_block .toggle_btn {transform: rotate(180deg); top: -37px; right: -33px;}


.toggle_brands {background: #000; right:13px;}
.toggle_brands:hover {transform: translateY(-2px); border-color: #fff;}



#menu_brands:checked ~ .middle .toggle_brands {border-color: #fff;}

#menu_brands:checked ~ .middle .middle_parent {max-height: 0; opacity: 0; padding: 0 25px; margin: 0;}
.toggle_brands::after {content: "❮"; font-size:14px; font-weight:bold; line-height: 1;}
#menu_brands:checked ~ .middle .toggle_brands {transform: rotate(180deg); right: 0;}

*/





.info_content {margin: 15px; height: 90%; background:#ddd;}

.stats_container {width:100%;max-width:500px;margin:0 auto;}

/*
.section_title {margin:20px 0 10px;font-size:16px;color:#333;border-bottom:1px solid #eee;padding-bottom:5px;}
*/

.bar_row {display:flex;align-items:center; margin:8px 10px;}
.bar_wrapper {width:50%;background:#f0f0f0;}

.work_hours_bar,.online_bar {height:20px;}
.work_hours_bar {width:100%;background:rgba(100,100,100,0.45);}

.online_bar {background:#d97878; max-width: 100%;}
.online_bar.blue {background:#82b8c5;}


.bar_label {margin-left:15px;font-size:14px;color:#555;}
.bar_label span{font-weight:bold;}

.stats_grid {margin-top:20px; display: flex; justify-content: space-around;}

.stat_item {min-width: 196px; background:#f8f8f8; padding:10px;}
.stat_item div {color: #666; font-size: 14px;}
.stat_item .online {background: #add5aa; padding:0 5px; color: #fff;}

/*
.stat_subtext {font-size:12px;color:#888;}
*/






p {margin:10px;}
.error {background: #fff; padding:3px 10px;}
.error a {text-decoration: underline; color: #d0bc3e}

h3 {margin:8px 10px;}



a {text-decoration:none; color:#000;}




/*
[data-cursor-follower]::after {
    content: '';
    position: absolute;
    width: 30px;
    height: 30px;
    background: rgba(255,255,255,0.3);
    border-radius: 50%;
    top: var(--y, 0);
    left: var(--x, 0);
    transform: translate(-50%, -50%);
    opacity: 1;
    transition: opacity 0.3s, transform 0.2s;
}
*/






/* Верхнее меню*/


/* Вариант 6: Пульсирующее свечение для активной кнопки */


@keyframes pulse {
    0% {box-shadow: 0 5px 15px rgba(52, 152, 219, 0.3);}
    50% {box-shadow: 0 5px 20px rgba(52, 152, 219, 0.6);}
    100% {box-shadow: 0 5px 15px rgba(52, 152, 219, 0.3);}
}


/*
.menu a span {background:#9c6e9a; color: #fff; font-size: 12px; padding:0 2px; position: absolute; right: 0; height: 16px; line-height: 16px;}
*/





.notify_side {width:180px; min-height:80px; height:auto; background:#fafafa; position:fixed; right:0; top:380px; display:none; z-index:16; border-left:4px solid #509460;}
.notify_side a {text-decoration:underline;}


/*
.brands_list {display:inline-flex; margin:5px 5px 10px 5px;}

.brands_list p {height:26px; display: block; line-height:26px; padding:0 8px; margin:0 3px; background: #fff; opacity: 0.2;}
.brands_list p.active {opacity: 0.6;}
*/


.table_choose {display:flex; text-align: center; align-items:center; font-size: 17px;}
.table_choose img {animation: float-up-down 2.0s infinite ease-in-out;}




.print-block {position: fixed; right:33px; background: rgba(255, 255, 255, 0.7); padding:10px 7px; border-radius: 8px; bottom: 10px; box-shadow: 0 0 15px rgba(0,0,0,0.2); z-index: 10; display: none;}



.btn-success {background: #6ec591;color: white;}
.btn_edit {background: #a4c1d2; color: white;}
.btn-danger {background: #dba785;color: white;}


.product-check {transform: scale(1.5); cursor: pointer; opacity: 0.5;}






/* СРЕДНИЙ БЛОК */

.middle {position: relative;}

.middle_parent {margin:10px 33px 10px 13px; padding:10px; transition: all 0.4s ease; border-radius:10px; background: #fff;}

.middle_block {display: flex; justify-content: space-between; align-items: flex-start;}
.middle_block p {margin:4px 4px; font-size: 14px;}

.middle_section {min-width: 300px;}

.main_h3 {display: inline-block; margin:0 4px;}


    .filter {display:flex; flex-wrap:wrap; gap:12px}

    .filter label {display:inline-flex;align-items:center;gap:10px; padding:8px 22px 7px 22px; border:1px solid #e9ecef;border-radius:8px;
        cursor:pointer;font-size:14px;transition:all 0.2s}

    .filter label i {width:24px; height:24px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px}

    .filter label:has(input:checked) {background:#fff; box-shadow:0 5px 15px rgba(0,0,0,0.1);}

    .filter label[data-green] i {background:rgba(46,204,113,0.1); color:#27ae60;}

    .filter label[data-red] i {background:rgba(204, 46, 46, 0.2); color: #ae2727;}
    .filter label:has(input:checked)[data-red] {background: linear-gradient(135deg, #e36d68 0%, #c72b2b 100%); color: #fff;}
    .filter label:has(input:checked)[data-red] i {background:#cb3333; color: #fff;}

    .filter label:has(input:checked)[data-green] {/*border-color:#27ae60;*/ /*background: #6ec591;*/ background:linear-gradient(135deg, #2ecc71 0%, #27ae60 100%); color:#fff;}
    .filter label:has(input:checked)[data-green] i {background:#6ec591; color:#fff;}

    .filter label[data-yellow] i {background:rgba(243,156,18,0.1); color:#c47a00;}
    .filter label:has(input:checked)[data-yellow] {background:linear-gradient(135deg, #cfbe86 0%, #cba34e 100%); color: #fff;}
    .filter label:has(input:checked)[data-yellow] i {background:#c7a235; color:#fff;}

    .filter label input{display:none;}

/*
.middle_update {display: flex; justify-content: flex-end; display: none;}

.middle_update p {font-size: 13px; margin:10px 3px;}
*/


    .update_time {color: #2ecc71; font-weight: bold; margin-left:10px;}
    .update_fine {color: #999;}

    .update_errors {color: #e9aeae; text-decoration: underline; cursor: pointer;}






/*
.section-title {font-size:18px;color:#2c3e50;margin-bottom:20px;padding-bottom:10px;border-bottom:2px solid #f0f0f0;}
*/

/* Основной блок с таблицей */

.main_block {display:flex; background:#e9e9e9; align-items:flex-start;}

.scrollup {width:60px; height:55px;/* background:url("../images/top.png");*/ display:none; position:fixed; bottom:74px;
    right:16px; z-index: 12; cursor: pointer; transform: rotate(90deg); background: #e5a5a5b3; line-height:55px; font-size: 34px; text-align: center; padding-bottom:5px;}

.scrollup::after {content: "❮"; font-weight:bold; color: #fff; }


#chars_enable:hover {color: #509460; cursor: pointer;}

.chars_sticky {position:fixed; left:1374px; width:430px; margin:6px; background: #fff; border: 1px solid #aaa; box-shadow: 0 0 15px rgba(0,0,0,0.2); display: none;}
.chars_sticky p {background: #f7f7f7; display: block; padding:5px 10px; margin: 0;}

@media (max-width: 1920px) {
    .chars_sticky {width: 515px;}
}


#detailChart {display:none;}










/* ФИЛЬТР БРЕНДОВ */

.brands {margin:10px 15px; padding:0 10px;}

.brands a {display:inline-block; padding: 5px 10px; margin:2px; background:#222; text-decoration:none; color:#fff; font-size: 14px;}

.brand.selected {background:#2a82bc; color: white;}
.brand.selected:hover {color: black;}

.brand:hover {background: #2a82bc;}

.brands .brand_all {background: #aaa; color: #fff;}
.brands .brand_all:hover {color: #000;}






/* ТАБЛИЦЫ */

.table_block {border-radius: 10px 10px 0 0; background: white; margin:0 33px 0 13px; padding-top:1px; position: relative;}

    .action_block {position:fixed; left:1519px; width:300px; min-width: 280px; max-width:333px; z-index:11; border-radius:10px 10px 0 0; box-sizing:border-box; margin-top: 10px;
    background: #fff; padding-bottom: 5px;}

    .action_block > p span {color:#2ecc71; font-weight:bold;}

    .action_title {margin:1px; padding:11px; background:#f4f4f4; text-align:center; color:#000;}

    .refresh_list {width:62px; display:inline-block; color:#000; background:#f4f4f4; padding:7px; margin-right:9px;}
    .action_block div {margin:10px 0; padding:8px 0; background:#fff; border:1px solid #eee;}
    .update_download {color:#ff6b6b; margin:25px 0; /*border-bottom: 1px solid #d69da3;*/ text-decoration: underline;}


    .action_block form {display:inline-block;}
    .action_block button {padding:8px 13px; background: linear-gradient(135deg, #3498db 0%, #2980b9 100%); color:#fff; text-decoration:none; border-radius:6px; transition:0.3s; margin-right:0;
    font-size: 15px;}

    .action_block form:nth-of-type(2) button {background:#ccc5e7;}


.table_container {min-height: 300px; overflow-x: auto; border-radius:0 0 10px 10px; box-shadow: 0 3px 10px rgba(0,0,0,0.05); background: white; margin:0 33px 0 13px;
    position: relative; transform: translate(0, 0);}

.table_fixed {background: linear-gradient(135deg, #333 0%, #333 100%); color: white; margin:10px 13px 0 13px; border-radius:10px 10px 0 0; font-size: 14px;}
.table_fixed td {font-weight: 600; border: none; text-align: center;}
.table_fixed a {display: inline-flex; align-items: center; gap: 5px; color: white; }


    .table_fixed path {transition: all linear .3s;}
    .table_fixed a:hover path {fill: #fff;}

    .sort_rotate {transform: rotate(180deg);}


.table_fixed td:nth-child(1) {width: 304px;}
.table_fixed td:nth-child(2) {width: 75px;}
.table_fixed td:nth-child(3) {width: 104px; /*background:#cbe6c9; background:#cee3d7; color: #000;*/ color: #6ec591;}
.table_fixed td:nth-child(4) {width: 104px; /*background:#e6d8cf; color: #000;*/ color: #c5a673;}
.table_fixed td:nth-child(5) {width: 100px; /*background:#bbb; color: #000;*//* color: #0b689e*/}

.table_fixed td:nth-child(6) {width: 69px;}
.table_fixed td:nth-child(7) {width:315px;}
.table_fixed td:nth-child(8) {width: 113px;}

.table_fixed td:nth-child(9) {width: 198px;}
.table_fixed td:nth-child(10) {width:36px;}

.table_fixed td:nth-child(11) {width:40px;}


    .select-all-btn {height: 36px; padding:5px 8px; margin:0 1px; border-radius: 8px; display: block; transition: all linear .2s; /*background:#6ec591;*/
        border: 1px solid #aaa; background: none; color: white; font-size: 14px;}
    .select-all-btn:hover {background:#6ec591;}
    .select-all-btn.active {background:#6ec591;}





/* Основная */

.table_main {/*width: 1500px;*/ margin:0 13px 13px; background: #fff; border-collapse:collapse;}
.table_main td {border-right:1px solid #ccc; border-bottom: 1px solid #ccc;}

/*
.table_main td:nth-child(1).on_delete_first {width: 1000px;}
.table_main td:last-child.on_delete_second {width: 500px;}
*/


.table_main td:nth-child(1) {width:314px;}
.table_main td:nth-child(1) p {margin-left: 0;}
    .quantity {font-size: 14px; color: #f7cccc; margin: 0 10px;}

.table_main .td_img {width:70px; color:#aaa; text-align: center; background: #fff;}
.table_main img {display:block; max-width:100%; max-height:100px; margin: 0 auto;}



.table_main td:nth-child(3) {width:310px; min-width:310px;}
.table_main td:nth-child(4) {width:68px; text-align: center;}

.table_main td:nth-child(5) {width:319px;}


.table_main td:nth-child(6) {width:114px; text-align: center;}
.table_main td:nth-child(6) a {transition:all linear .2s;}
.table_main td:nth-child(6) a:hover {color:#FF0000;}
.table_main td:nth-child(7) {width:200px; text-align:center;}


.table_main .item_action:hover {opacity:1;}

.table_main tr:hover {background:#fafafa;}
.table_main td:nth-child(6) {text-align:center;}

.table_main td:nth-child(8) {width:40px; text-align: center;}
.table_main td:nth-child(8) div {/*height:96px;*/ display: flex; font-size: 16px; color: #999; flex-direction: column; align-items: center; justify-content:space-between;}

.table_main td:nth-child(8) div a {display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 6px; margin: 10px 0;}


.table_main td:nth-child(8) a:first-child {background: #f9eecd; color:#edc37b;}
.table_main td:nth-child(8) a:first-child:active {background: #f6e7b9;}
.table_main td:nth-child(8) a:last-child {background: #ffeded; color:#e9aeae;}
.table_main td:nth-child(8) a:last-child:active {background: #fae2e2;}
.table_main td:nth-child(8) a:hover {transform: translateY(-2px);}


.table_main td:nth-child(8) div svg {transition: all linear .4s; fill:rgba(63, 68, 71, 0.4);}
.table_main td:nth-child(8) div svg:hover {fill: #000;}
.table_main td:nth-child(8) div a:nth-child(2) svg {width: 20px; fill: #e9e8e8;}

.table_main td:last-child {width:40px; text-align:center;}

/*
.action-btns { display: flex; gap: 5px; }
.action-btns a { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 6px; }
*/




.td_prices > div {display: flex; flex-direction: row; flex-wrap: wrap;}
.td_prices > div > div {width: 100px; height: 53px; text-align: center;}

.td_prices > div > div:nth-child(2) {border-right:1px solid #ccc; border-left: 1px solid #ccc;}


#prices {display: flex; flex-direction: row; flex-wrap: wrap;}
#prices div {width: 100px; height: 53px; text-align: center;}
/*
#prices div:nth-child(2), #prices div:nth-child(5) {border-right:1px solid #ccc; border-left: 1px solid #ccc;}
*/
.diff_price span {font-weight: 500; border-radius: 6px; padding: 4px 12px; }

.red {background: #ffeded; color: #d16d6d; }
.green {background:#cdefcb; background: #e6f7e6; color: #27ae60;}
.yellow {background:#fbfcda; background:#fff9e6; color: #f39c12;}
.purpur {background:#fbfcda; background: #fce6ff; color: #8e12f3;}

.td_prices #oph_price span, .td_prices #our_price span {color: #f7cccc;}



.tx {vertical-align:top; padding-bottom:2px;}
.tx > div {height:100%; min-height:110px; display: flex; flex-direction: column; justify-content: space-between;}





.table_main .price_error {color:#ccc;}

    .refresh {margin:10px auto 0; transition:all linear .3s}
    .refresh button {font-size: 16px; border-radius: 6px; background: #e3ecf1; padding: 4px 9px;}
    .refresh button:active {background: #cce0ea;}
    .refresh button svg {width: 14px; height: 14px;}
    .refresh button:hover {transform: translateY(-2px);}


.restore div {display: flex; justify-content: space-between; margin:10px;}

.name_info {color:#ccc; font-size:14px;}
.name_info a {color:#e9e9e9; text-decoration:underline;}
.name_info a:hover {color:red;}











#svg {/*border:1px solid black; /*transform:rotate(180deg);*/transform:scaleY(-1);}
#sg {background:#CCC;}


.graphic_td {position:relative; outline:1px solid #888; outline-offset:-3px; opacity:0;}
.graphic_td:hover {outline:2px solid #093;}

.graphic_button {width:100%; height:100%; display:block; position:absolute; /utline:1px solid #933; top:0; background:transparent; border:0; display: none;}
.graphic_button:hover {/*outline-color:#399;*/ cursor:pointer;}

.graphic_td:visited {border:2px solid blue;}




textarea {width:95%; font-family: 'Segoe UI', system-ui, sans-serif; background:transparent; padding:5px; border:1px solid #f5f5f5;}
textarea:hover {border:1px solid #ddd;}

/*
.refresh {width:60px; height:30px; line-height: 30px; margin: 0 auto; border: 1px solid #eeee; transition:  all linear .3s}
*/

/*
table input[type="submit"] {border:0; background:transparent; padding:2px 5px; font-family: 'Segoe UI', system-ui, sans-serif; font-size:20px; margin:0 auto; color:#444;
    display:block; transition: all 0.3s ease;}

*/

.refresh:hover {border-color: #555; cursor: pointer;}
.refresh:hover input[type="submit"] {border-color:#666 !important; font-weight: 600; cursor:pointer; animation: rotate 1s linear infinite;}




textarea:focus {outline:1px solid #aaa;}



.temp_act {background-color:#cbe6c9 !important; transition:background-color 0.4s ease-in-out;}
/*
.product-info {font-family:Arial, sans-serif; font-size:14px; color:#333;}
*/
.product-meta {display:flex; align-items:center; gap:8px;}

.meta-label {color:#ddd;}

.copy-btn {background:none; border:none; padding:4px; cursor:pointer; display:inline-flex; align-items:center;
    /*position:relative; */color:#666; transition:all 0.2s ease;}

.copy-btn:hover {color:#509460; transform:translateY(-1px);}
.copy-icon {width:16px; height:16px; display:block;}

.copy-feedback {position:absolute; top:-25px; left:50%; transform:translateX(-50%); background:#cfdfce; padding:10px 10px; color:black; border-radius:0;
 font-size:14px; opacity:0; transition:opacity 0.3s; pointer-events:none; white-space:nowrap;}


.copy-btn.copied .copy-feedback {opacity:1;}
.copy-btn.copied .copy-icon {color:#509460;}


.new_links textarea {width:380px; background:#f6f6f6; padding:5px 0 5px 15px; border:1px solid #777; margin-left:10px;}
.new_links input[type="submit"] {display:block; margin:10px; padding:2px 15px; font-family: 'Segoe UI', system-ui, sans-serif; background:#aaa; color:#000; border:1px solid #666;
    transition:all linear .2s;}
.new_links input[type="submit"]:hover {cursor:pointer; background:#a0a0a0;}




@media (min-width: 2560px)
{
    .table_fixed {font-size: 18px;}

    .middle_block p {font-size: 18px;}
    .filter label {font-size:18px; padding: 12px 22px 11px 22px;}
    .filter label i {width:24px; height:24px; font-size:14px;}


    .table_fixed td:nth-child(1) {width: 494px;}
    .table_fixed td:nth-child(2) {width: 115px;}
    .table_fixed td:nth-child(3) {width: 144px;}
    .table_fixed td:nth-child(4) {width: 144px;}
    .table_fixed td:nth-child(5) {width: 140px;}

    .table_fixed td:nth-child(6) {width: 129px;}
    .table_fixed td:nth-child(7) {width: 495px;}
    .table_fixed td:nth-child(8) {width: 153px;}

    .table_fixed td:nth-child(9) {width: 238px;}
    .table_fixed td:nth-child(10) {width:76px;}

    .table_fixed td:nth-child(11) {width:60px;}





    .table_main td:nth-child(1) {width:504px;}

    .table_main .td_img {width:110px;}


    .table_main td:nth-child(3) {width:432px;}
    .table_main td:nth-child(4) {width:128px;}

    .table_main td:nth-child(5) {width:509px;}


    .table_main td:nth-child(6) {width:134px;}

    .table_main td:nth-child(7) {width:245px;}

    .table_main td:nth-child(8) {width:85px;}
    .table_main td:nth-child(8) div {font-size: 18px;}

    .table_main td:nth-child(8) div a {width:40px; height:40px; margin: 10px 0;}
    .table_main td:nth-child(8) div a:nth-child(2) svg {width: 20px; fill: #e9e8e8;}
    .table_main td:last-child {width:55px;}


    .td_prices > div > div {width: 140px;}
    #prices div {width: 140px;}

    .refresh button {font-size: 18px; padding: 8px 11px;;}
    .refresh button svg {width: 18px; height: 18px;}
    .name_info {font-size:17px;}



    .select-all-btn {height: 36px; padding:5px 8px; margin: 0 auto; font-size: 18px;}


    body {font-size: 18px;}

    .enter h2 {font-size:18px;  }
    .enter h3 {font-size:18px; }

    .enter input { font-size:18px;}

    summary::after {font-size:29px;}

    .offline {font-size:0.9em;}


    .user_block {width: 40%;}

    .menu > span {width: 28px; height: 34px; line-height: 34px; font-size: 18px;}
    .menu a {font-size: 18px; padding: 12px 22px; margin: 3px 5px;}


    .count_action {font-size: 14px;}
    .count_errors {font-size: 14px;}

    .bar_label {font-size:17px;}
    .stat_item div {font-size: 17px;}

    .table_choose {font-size: 19px;}

    .brands a {padding:7px 14px; font-size: 18px;}

    .scrollup {width:70px; height:65px; line-height:65px; font-size: 36px; padding-bottom:5px;}

    .copy-feedback {position:absolute; top:-25px; left:50%; padding:10px 10px; font-size:17px;}


    .action_block {left:2249px; width:330px; min-width: 280px; max-width:333px;}

    .action_block > p span {color:#2ecc71; font-weight:bold;}

    .action_title {margin:1px; padding:11px; background:#f4f4f4; text-align:center; color:#000;}

    .refresh_list {width:76px;}
    .action_block div {margin:10px 0; padding:8px 0;}


    .action_block button {padding:8px 13px; font-size: 18px;}

    .action_block form:nth-of-type(2) button {background:#ccc5e7;}

    .print-block {right:auto; left:2249px; padding:10px 7px;}
    .print-block button {font-size: 18px;}

}




@media (max-width: 1820px)
{
    .table_fixed td:nth-child(1) {width: 201px;}
    .table_fixed td:nth-child(7) {width: 210px;}

    .table_main td:nth-child(1) {width:211px;}
    .table_main td:nth-child(5) {width:210px;}

    .action_block {left:1298px;}
}

@media (max-width: 1640px)
{
    .table_main, .action_block, .td_prices span {font-size: 14px;}
    .table_main p {margin:6px;}

    .table_fixed td:nth-child(1) {width: 191px;}
    .table_fixed td:nth-child(7) {width: 200px;}

    .table_main td:nth-child(1) {width:201px;}
    .table_main td:nth-child(5) {width:200px;}

    .action_block {left:1276px;}
}




/* Анимации */

@keyframes rotate {
    from {transform: rotate(0deg);}
    to {transform: rotate(360deg);}
}

@keyframes float-up-down {
    0%, 100% {transform: translateY(0); animation-timing-function: ease-out;}
    25% {transform: translateY(-5px); animation-timing-function: ease-in;}
    50% {transform: translateY(0); animation-timing-function: ease-out;}
    75% {transform: translateY(-5px); animation-timing-function: ease-in;}
}

.value-label::after {content: "";position: absolute;background: white;border-radius: 3px;padding: 2px 5px;z-index: -1;}