/* ============================================================
   COMPUTER & SERVICE
   Foglio di stile generale

   Palette C&S:
   Rosso principale : #990000
   Rosso evidenza   : #b30000
   Giallo           : #ffcc00
   Sfondo esterno   : #000000
   ============================================================ */


/* ============================================================
   BASE
   ============================================================ */

* {
    box-sizing: border-box;
}

html {
    margin: 0;
    padding: 0;
    background: #000000;
}

body {
    margin: 0;
    padding: 0;
    background: #000000;
    color: #222222;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.45;
}

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

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

a:hover,
a:focus {
    color: #b30000;
    text-decoration: underline;
}


/* ============================================================
   CONTENITORE GENERALE
   ============================================================ */

.cs-site {
    width: 100%;
    max-width: 1180px;
    min-height: 100vh;
    margin: 0 auto;
    background: #ffffff;
    border-left: 1px solid #333333;
    border-right: 1px solid #333333;
    box-shadow: 0 0 14px rgba(255, 255, 255, 0.12);
}


/* ============================================================
   TESTATA
   ============================================================ */

.cs-header {
    background: #ffffff;
    border-top: 5px solid #990000;
}

.cs-header-inner {
    display: grid;
    grid-template-columns: 115px minmax(0, 1fr) 115px;
    align-items: center;
    gap: 10px;
    min-height: 105px;
    padding: 8px 12px;
}

.cs-header-logo {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.cs-header-logo-right {
    justify-content: flex-end;
}

.cs-header-logo img {
    display: block;
    max-width: 105px;
    max-height: 90px;
}

.cs-header-title {
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.cs-header-title a {
    display: block;
    width: 100%;
    text-align: center;
}

.cs-header-title img {
    display: inline-block;
    max-width: 100%;
    max-height: 90px;
}


/* ============================================================
   MENU PRINCIPALE
   ============================================================ */

.cs-main-menu {
    position: relative;
    z-index: 1000;
    background: #990000;
    border-top: 1px solid #4d0000;
    border-bottom: 1px solid #4d0000;
}

.cs-main-menu-list {
    display: flex;
    align-items: stretch;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.cs-main-menu-list > li {
    position: relative;
    margin: 0;
    padding: 0;
    border-right: 1px solid #4d0000;
}

.cs-main-menu-list > li > a {
    display: block;
    min-height: 38px;
    padding: 10px 15px;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    line-height: 18px;
    text-decoration: none;
    white-space: nowrap;
}

.cs-main-menu-list > li > a:hover,
.cs-main-menu-list > li:hover > a,
.cs-main-menu-list > li:focus-within > a {
    background: #b30000;
    color: #ffffff;
    text-decoration: none;
}

.cs-menu-account {
    margin-left: auto !important;
    border-left: 1px solid #4d0000;
}

.cs-menu-arrow {
    margin-left: 4px;
    font-size: 9px;
}


/* ============================================================
   SOTTOMENU
   ============================================================ */

.cs-submenu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 2000;
    display: none;
    min-width: 205px;
    margin: 0;
    padding: 0;
    background: #ffffff;
    border: 1px solid #990000;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.28);
    list-style: none;
}

.cs-submenu-right {
    right: 0;
    left: auto;
}

.cs-has-submenu:hover > .cs-submenu,
.cs-has-submenu:focus-within > .cs-submenu {
    display: block;
}

.cs-submenu li {
    margin: 0;
    padding: 0;
    border-bottom: 1px solid #dddddd;
}

.cs-submenu li:last-child {
    border-bottom: 0;
}

.cs-submenu a {
    display: block;
    padding: 9px 12px;
    color: #222222;
    font-size: 13px;
    text-decoration: none;
    white-space: nowrap;
}

.cs-submenu a:hover,
.cs-submenu a:focus {
    background: #b30000;
    color: #ffffff;
    text-decoration: none;
}


/* ============================================================
   LAYOUT PUBBLICO A TRE COLONNE
   ============================================================ */

.cs-layout {
    display: grid;
    grid-template-columns: 190px minmax(0, 1fr) 205px;
    align-items: start;
    gap: 10px;
    padding: 10px;
}

.cs-sidebar-left,
.cs-sidebar-right,
.cs-content {
    min-width: 0;
}


/* ============================================================
   BOX LATERALI
   ============================================================ */

.cs-side-box {
    margin-bottom: 10px;
    background: #ffffff;
    border: 1px solid #c7c7c7;
}

.cs-side-title {
    padding: 6px 8px;
    background: #990000;
    color: #ffffff;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
}

.cs-side-body {
    padding: 9px;
    font-size: 12px;
}

.cs-side-body p {
    margin: 0 0 8px;
}

.cs-side-body p:last-child {
    margin-bottom: 0;
}

.cs-side-centered {
    text-align: center;
}

.cs-side-image {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 4px auto 8px;
}

.cs-hot-image {
    max-width: 120px;
}


/* ============================================================
   MENU LATERALE
   ============================================================ */

.cs-side-menu {
    margin: 0;
    padding: 0;
    list-style: none;
}

.cs-side-menu li {
    margin: 0;
    border-bottom: 1px solid #dddddd;
}

.cs-side-menu li:last-child {
    border-bottom: 0;
}

.cs-side-menu a {
    display: block;
    padding: 7px 9px;
    color: #990000;
    font-size: 12px;
    font-weight: bold;
    text-decoration: none;
}

.cs-side-menu a:hover,
.cs-side-menu a:focus {
    background: #f5f5f5;
    color: #b30000;
    text-decoration: none;
}


/* ============================================================
   CALENDARIO LATERALE
   ============================================================ */

.cs-calendar {
    padding: 7px;
    background: #ffffff;
}

.cs-calendar-month {
    margin-bottom: 6px;
    color: #990000;
    font-size: 13px;
    font-weight: bold;
    text-align: center;
}

.cs-calendar-table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.cs-calendar-table th {
    padding: 3px 1px;
    background: #990000;
    color: #ffffff;
    border: 1px solid #4d0000;
    font-size: 10px;
    text-align: center;
}

.cs-calendar-table td {
    height: 24px;
    padding: 2px 1px;
    border: 1px solid #dddddd;
    font-size: 10px;
    text-align: center;
    vertical-align: middle;
}

.cs-calendar-empty {
    background: #f7f7f7;
}

.cs-calendar-today {
    background: #ffcc00;
    color: #000000;
    font-weight: bold;
}

.cs-calendar-link {
    margin-top: 7px;
    font-size: 11px;
    text-align: center;
}


/* ============================================================
   TELEFONO
   ============================================================ */

.cs-phone {
    display: inline-block;
    margin-top: 3px;
    color: #990000;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
}

.cs-phone:hover,
.cs-phone:focus {
    color: #b30000;
    text-decoration: none;
}


/* ============================================================
   CONTENUTO CENTRALE
   ============================================================ */

.cs-page-title {
    margin-bottom: 10px;
    padding: 7px 10px;
    background: #990000;
    color: #ffffff;
    border-left: 5px solid #b30000;
    font-size: 18px;
    font-weight: bold;
}

.cs-section-title {
    margin: 12px 0 8px;
    padding: 6px 9px;
    background: #f0f0f0;
    color: #990000;
    border-left: 4px solid #990000;
    font-size: 15px;
    font-weight: bold;
}

.cs-content-box {
    margin-bottom: 10px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid #cccccc;
}

.cs-content-box h1 {
    margin: 0 0 12px;
    color: #990000;
    font-size: 22px;
}

.cs-content-box h2 {
    margin: 0 0 8px;
    color: #990000;
    font-size: 17px;
}

.cs-content-box h3 {
    margin: 0 0 7px;
    color: #990000;
    font-size: 15px;
}

.cs-content-box p {
    margin-top: 0;
}

.cs-news-text {
    white-space: pre-line;
}


/* ============================================================
   STRISCE NEWS / HOT
   ============================================================ */

.cs-news-strip,
.cs-hot-strip {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    padding: 7px 9px;
    border: 1px solid #cccccc;
}

.cs-news-strip {
    background: #fff8f8;
    color: #990000;
    border-color: #d6b8b8;
}

.cs-hot-strip {
    background: #fff0f0;
    color: #990000;
    border-color: #d8aaaa;
}

.cs-news-strip img,
.cs-hot-strip img {
    flex: 0 0 auto;
    max-height: 30px;
    width: auto;
}

.cs-news-strip a,
.cs-hot-strip a {
    color: #990000;
    font-weight: bold;
}

.cs-news-strip a:hover,
.cs-hot-strip a:hover {
    color: #b30000;
}


/* ============================================================
   HOME
   ============================================================ */

.cs-home-welcome {
    margin-bottom: 10px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid #cccccc;
}

.cs-home-welcome h1 {
    margin: 0 0 8px;
    color: #990000;
    font-size: 21px;
}

.cs-home-links {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 10px;
}

.cs-home-link {
    display: block;
    padding: 9px;
    background: #f5f5f5;
    border: 1px solid #cccccc;
    color: #990000;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
}

.cs-home-link:hover,
.cs-home-link:focus {
    background: #fff0f0;
    border-color: #b30000;
    color: #b30000;
    text-decoration: none;
}


/* ============================================================
   BOTTONI
   ============================================================ */

.cs-button {
    display: inline-block;
    padding: 7px 12px;
    background: #990000;
    color: #ffffff !important;
    border: 1px solid #4d0000;
    border-radius: 2px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
    font-weight: bold;
    line-height: 1.2;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
}

.cs-button:hover,
.cs-button:focus {
    background: #b30000;
    color: #ffffff !important;
    border-color: #990000;
    text-decoration: none !important;
}

.cs-button:disabled {
    opacity: 0.6;
    cursor: default;
}

.cs-button-full {
    display: block;
    width: 100%;
}

.cs-button-secondary {
    background: #555555;
    border-color: #333333;
}

.cs-button-secondary:hover,
.cs-button-secondary:focus {
    background: #777777;
    border-color: #555555;
}

.cs-button-danger {
    background: #990000;
    border-color: #4d0000;
}

.cs-button-danger:hover,
.cs-button-danger:focus {
    background: #b30000;
}

.cs-button-small {
    padding: 4px 7px;
    font-size: 11px;
}


/* ============================================================
   TABELLE
   ============================================================ */

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

.cs-table {
    width: 100%;
    border-collapse: collapse;
}

.cs-table th {
    padding: 7px 8px;
    background: #990000;
    color: #ffffff;
    border: 1px solid #4d0000;
    font-size: 12px;
    text-align: left;
}

.cs-table td {
    padding: 7px 8px;
    border: 1px solid #dddddd;
    font-size: 12px;
    vertical-align: top;
}

.cs-table tbody tr:nth-child(even) {
    background: #f7f7f7;
}

.cs-table tbody tr:hover {
    background: #fff8df;
}


/* ============================================================
   FORM
   ============================================================ */

.cs-form-row {
    margin-bottom: 12px;
}

.cs-form-row label {
    display: block;
    margin-bottom: 4px;
    color: #333333;
    font-weight: bold;
}

.cs-form-row input[type="text"],
.cs-form-row input[type="password"],
.cs-form-row input[type="email"],
.cs-form-row input[type="number"],
.cs-form-row input[type="date"],
.cs-form-row select,
.cs-form-row textarea,
.cs-input {
    width: 100%;
    max-width: 100%;
    padding: 7px 8px;
    background: #ffffff;
    color: #222222;
    border: 1px solid #aaaaaa;
    border-radius: 2px;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 13px;
}

.cs-form-row textarea {
    min-height: 120px;
    resize: vertical;
}

.cs-form-row input:focus,
.cs-form-row select:focus,
.cs-form-row textarea:focus,
.cs-input:focus {
    border-color: #990000;
    outline: 1px solid #990000;
}

.cs-field-note {
    margin-top: 4px;
    color: #666666;
    font-size: 11px;
}


/* ============================================================
   MESSAGGI
   ============================================================ */

.cs-message {
    margin: 10px 0;
    padding: 9px 10px;
    border: 1px solid #cccccc;
    font-size: 13px;
}

.cs-message-info {
    background: #fff8e8;
    color: #704d00;
    border-color: #dfc988;
}

.cs-message-success {
    background: #edf8ed;
    color: #165c16;
    border-color: #a7cfa7;
}

.cs-message-error {
    background: #fff0f0;
    color: #990000;
    border-color: #cc9999;
}

.cs-login-status {
    min-height: 20px;
    margin-top: 7px;
    color: #990000;
    font-weight: bold;
}


/* ============================================================
   FOOTER
   ============================================================ */

.cs-footer {
    padding: 12px 15px;
    background: #990000;
    color: #ffffff;
    border: 0;
    font-size: 11px;
    line-height: 1.6;
    text-align: center;
}

.cs-footer a {
    color: #ffcc00;
}

.cs-footer a:hover,
.cs-footer a:focus {
    color: #ffffff;
}

.cs-footer-promo {
    margin-bottom: 6px;
    padding-bottom: 5px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.25);
    color: #ffcc00;
    font-size: 12px;
    font-weight: bold;
}


/* ============================================================
   AREA AMMINISTRATIVA
   ============================================================ */

.cs-admin-site-header {
    border-top-color: #990000;
}

.cs-admin-menu {
    background: #990000;
    border-top-color: #4d0000;
    border-bottom-color: #4d0000;
}

.cs-admin-menu .cs-main-menu-list > li {
    border-right-color: #4d0000;
}

.cs-admin-menu .cs-menu-account {
    border-left-color: #4d0000;
}

.cs-admin-menu .cs-main-menu-list > li > a:hover,
.cs-admin-menu .cs-main-menu-list > li:hover > a,
.cs-admin-menu .cs-main-menu-list > li:focus-within > a {
    background: #b30000;
}

.cs-admin-menu .cs-submenu {
    border-color: #990000;
}

.cs-admin-menu .cs-submenu a:hover,
.cs-admin-menu .cs-submenu a:focus {
    background: #b30000;
}

.cs-admin-bar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 6px 12px;
    background: #f0f0f0;
    color: #333333;
    border-bottom: 1px solid #bbbbbb;
    font-size: 12px;
}

.cs-admin-bar > strong {
    color: #990000;
}

.cs-admin-main,
.cs-admin-content {
    width: 100%;
    padding: 12px;
}

.cs-admin-card {
    margin-bottom: 12px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid #bbbbbb;
}

.cs-admin-page-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 12px;
    padding: 8px 10px;
    background: #f0f0f0;
    border-left: 5px solid #990000;
    border-bottom: 1px solid #cccccc;
}

.cs-admin-page-header h1 {
    margin: 0;
    color: #990000;
    font-size: 20px;
}

.cs-admin-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.cs-actions-inline {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.cs-admin-dashboard {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.cs-admin-module {
    padding: 12px;
    background: #f7f7f7;
    border: 1px solid #c7c7c7;
    border-top: 3px solid #990000;
}

.cs-admin-module h2 {
    margin: 0 0 7px;
    color: #990000;
    font-size: 17px;
}

.cs-admin-module p {
    min-height: 42px;
    margin: 0 0 10px;
}

.cs-admin-footer {
    margin-top: 0;
}


/* ============================================================
   COMPATIBILITA' PAGINE ADMIN ESISTENTI
   ============================================================ */

.cs-main {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 12px;
}

.cs-card {
    margin-bottom: 12px;
    padding: 12px;
    background: #ffffff;
    border: 1px solid #bbbbbb;
}

.cs-admin-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 12px;
    padding-bottom: 8px;
    border-bottom: 2px solid #990000;
}

.cs-admin-header h1 {
    margin: 0;
    color: #990000;
}

.cs-admin-user {
    margin: 5px 0 0;
}

.cs-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.cs-module {
    padding: 12px;
    background: #f7f7f7;
    border: 1px solid #cccccc;
    border-top: 3px solid #990000;
}

.cs-module h2 {
    margin-top: 0;
    color: #990000;
}


/* ============================================================
   RESPONSIVE - TABLET
   ============================================================ */

@media (max-width: 900px) {

    .cs-header-inner {
        grid-template-columns: 90px minmax(0, 1fr) 90px;
    }

    .cs-header-logo img {
        max-width: 80px;
    }

    .cs-layout {
        grid-template-columns: 165px minmax(0, 1fr);
    }

    .cs-content {
        grid-column: 2;
        grid-row: 1;
    }

    .cs-sidebar-left {
        grid-column: 1;
        grid-row: 1;
    }

    .cs-sidebar-right {
        grid-column: 1 / -1;
        grid-row: 2;
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .cs-sidebar-right .cs-side-box {
        margin-bottom: 0;
    }

    .cs-main-menu-list {
        flex-wrap: wrap;
    }

    .cs-menu-account {
        margin-left: 0 !important;
    }

    .cs-admin-dashboard,
    .cs-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

}


/* ============================================================
   RESPONSIVE - TELEFONO
   ============================================================ */

@media (max-width: 680px) {

    body {
        background: #000000;
    }

    .cs-site {
        border: 0;
        box-shadow: none;
    }

    .cs-header-inner {
        grid-template-columns: 65px minmax(0, 1fr);
        min-height: 80px;
        padding: 6px 8px;
    }

    .cs-header-logo img {
        max-width: 60px;
        max-height: 65px;
    }

    .cs-header-logo-right {
        display: none;
    }

    .cs-header-title img {
        max-height: 65px;
    }

    .cs-main-menu-list {
        display: block;
    }

    .cs-main-menu-list > li {
        width: 100%;
        border-right: 0;
        border-bottom: 1px solid #4d0000;
    }

    .cs-main-menu-list > li > a {
        min-height: 0;
        padding: 9px 12px;
    }

    .cs-menu-account {
        border-left: 0;
    }

    .cs-submenu,
    .cs-submenu-right {
        position: static;
        width: 100%;
        min-width: 0;
        box-shadow: none;
    }

    .cs-submenu a {
        padding-left: 24px;
    }

    .cs-layout {
        display: flex;
        flex-direction: column;
        gap: 10px;
        padding: 8px;
    }

    .cs-content {
        order: 1;
        width: 100%;
    }

    .cs-sidebar-left {
        order: 2;
        width: 100%;
    }

    .cs-sidebar-right {
        order: 3;
        display: block;
        width: 100%;
    }

    .cs-sidebar-right .cs-side-box {
        margin-bottom: 10px;
    }

    .cs-home-links {
        grid-template-columns: 1fr;
    }

    .cs-page-title {
        font-size: 16px;
    }

    .cs-content-box {
        padding: 9px;
    }

    .cs-admin-bar {
        align-items: flex-start;
        flex-direction: column;
        gap: 2px;
    }

    .cs-admin-page-header,
    .cs-admin-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .cs-admin-dashboard,
    .cs-grid {
        grid-template-columns: 1fr;
    }

    .cs-admin-main,
    .cs-admin-content {
        padding: 8px;
    }

}
/* Collegamenti specifici dei moduli nella struttura Admin comune. */
.cs-admin-local-nav { margin-bottom: 12px; padding: 8px 10px; background: #f0f0f0; border-bottom: 1px solid #cccccc; }
.cs-admin-local-nav a { padding: 4px 8px; }

/* Contenuti recuperati dal sito storico. */
.cs-editorial { line-height:1.65; overflow-wrap:anywhere; }
.cs-editorial h2 { color:#990000; font-size:18px; margin:22px 0 10px; }
.cs-editorial h3 { color:#990000; margin:16px 0 8px; }
.cs-editorial p { margin:10px 0; }
.cs-editorial img { max-width:100%; height:auto; }
.cs-editorial table { width:100%; border-collapse:collapse; margin:12px 0; }
.cs-editorial td,.cs-editorial th { padding:8px; border:1px solid #ccc; text-align:left; }
.cs-editorial th { background:#990000; color:white; }
.cs-editorial ul { padding-left:22px; }
.cs-editorial a { overflow-wrap:anywhere; }
.cs-location-photo { width:100%; }
.cs-faq { border-bottom:1px solid #ccc; padding:12px 0; }
.cs-faq summary { cursor:pointer; color:#990000; font-weight:bold; }
.cs-faq div { padding:10px 0; }
.cs-editorial output { display:block; overflow-wrap:anywhere; padding:10px; background:#f0f0f0; }
.cs-admin-menu .cs-main-menu-list,.cs-main-menu-list { flex-wrap:wrap; }
.cs-main-menu-list a:focus-visible { outline:2px solid #ffcc00; outline-offset:-3px; }
.cs-has-submenu:focus-within > .cs-submenu { display:block; }
.cs-honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }

.cs-pre-wrap { white-space:pre-wrap; } .cs-chat-columns { display:grid; grid-template-columns:minmax(0,1fr) 135px; gap:12px; } #chatMessages { height:340px; overflow:auto; border:1px solid #bbb; padding:10px; background:#fafafa; } #chatMessages p { margin:0 0 9px; white-space:pre-wrap; overflow-wrap:anywhere; } #chatText { width:100%; } #chatUsers { padding-left:18px; } @media(max-width:680px){.cs-chat-columns{grid-template-columns:1fr;} #chatUsers{display:flex;flex-wrap:wrap;gap:18px;}}

.cs-partner-logos { display:flex; flex-wrap:wrap; justify-content:center; gap:18px; padding:12px; border-top:1px solid #ccc; } .cs-partner-logos img { max-height:25px; max-width:110px; object-fit:contain; }

/* Identità grafica del sito storico: rosso #990000, blu e giallo. */
.cs-layout { gap:14px; padding:14px; background:#f8f9fa; }
.cs-content-box,.cs-side-box,.cs-offer-card { border:1px solid #d0d7de; border-radius:8px; box-shadow:0 3px 7px rgba(0,0,0,.05); }
.cs-side-box { overflow:hidden; margin-bottom:14px; }
.cs-side-title { padding:10px; }
.cs-side-body { padding:12px; line-height:1.6; }
.cs-page-title,.cs-section-title { border-radius:8px; }
.cs-content-box { padding:15px; }
.cs-button,.cs-home-link { border-radius:6px; }
.cs-side-image { display:block; max-width:100%; height:auto; margin:8px auto; object-fit:contain; }
.cs-side-banner { display:block; text-align:center; }
.cs-side-banner img { display:block; max-width:100%; height:auto; margin:6px auto 10px; border-radius:6px; }
.cs-side-banner span { display:block; padding:7px; }
.cs-blue-box .cs-side-title { background:#004481; }
.cs-amica-box,.cs-amica-box .cs-side-title { background:#000060; color:#fff; }
.cs-amica-box a { color:#fff; }
.cs-social-button,.cs-chat-button { display:block; padding:9px 6px; border-radius:6px; text-align:center; font-weight:bold; }
.cs-social-button,.cs-social-button:hover { background:#1877f2; color:white; }
.cs-chat-button,.cs-chat-button:hover { background:#ffc107; color:#222; }
#sidebarSearch { display:block; width:100%; padding:8px; margin:6px 0 8px; border:1px solid #b6c2ce; border-radius:5px; }
.cs-blue-box button { background:#004481; width:100%; }
.cs-news-strip,.cs-hot-strip { border:0; border-radius:8px; padding:10px 12px; margin-bottom:14px; }
.cs-news-strip { background:#000080; color:#fff; }
.cs-hot-strip { background:#990000; color:#fff; font-weight:bold; }
.cs-news-strip a,.cs-hot-strip a,.cs-news-strip a:hover,.cs-hot-strip a:hover { color:#ffcc00; }
.cs-news-strip-label,.cs-hot-strip-label { flex:0 0 auto; }
.cs-header-title { padding:2px 10px; }
.cs-header-title a { position:relative; overflow:hidden; animation:cs-title-pulse 8s infinite ease-in-out; }
.cs-header-title a::after { content:""; pointer-events:none; position:absolute; top:-50%; left:-150%; width:60%; height:200%; background:linear-gradient(to right,transparent,rgba(255,255,255,.75),transparent); transform:rotate(25deg); animation:cs-title-shine 6s infinite ease-in-out; }
@keyframes cs-title-pulse { 0%,100% { transform:scale(1); } 50% { transform:scale(1.025); } }
@keyframes cs-title-shine { 0% { left:-150%; } 35%,100% { left:180%; } }
.cs-offers-list { display:flex; flex-direction:column; gap:20px; margin:14px 0; }
.cs-offer-card { background:#fff; overflow:hidden; }
.cs-offer-title { margin:0; padding:11px 15px; background:#990000; color:#fff; text-align:center; font-size:16px; text-transform:uppercase; letter-spacing:.4px; }
.cs-offer-body { display:flex; align-items:center; gap:16px; padding:16px; }
.cs-offer-image { flex:0 0 115px; }
.cs-offer-image img { display:block; width:115px; height:125px; padding:5px; object-fit:contain; border:1px solid #e1e4e8; border-radius:6px; background:#fafafa; }
.cs-offer-description { flex:1; min-width:0; line-height:1.6; overflow-wrap:anywhere; }
.cs-offer-date { font-size:11px; color:#68727d; margin:0 0 8px; }
.cs-offer-price { flex:0 0 auto; padding:12px; border:1px solid #e1e4e8; border-radius:6px; background:#f8f9fa; text-align:center; }
.cs-offer-price strong { display:block; color:#990000; font-size:20px; white-space:nowrap; }
.cs-offer-price span { display:block; color:#000060; font-size:11px; font-weight:bold; }
.cs-all-offers { text-align:right; margin:14px 0 22px; }
.cs-catalog-table { table-layout:fixed; }
.cs-catalog-table .cs-price-column { width:128px; }
.cs-catalog-table th:last-child,.cs-catalog-table td:last-child { text-align:right; white-space:nowrap; font-variant-numeric:tabular-nums; }
.cs-catalog-table td:first-child { overflow-wrap:anywhere; }
.cs-catalog-table th { background:#004481; border-color:#003366; }
.cs-chat-panel { border-top:4px solid #ffc107; }
#chatJoin { display:flex; flex-wrap:wrap; gap:10px; align-items:center; }
#chatJoin label { flex-basis:100%; margin:0; }
#chatJoin input { width:auto; flex:1 1 180px; }
#chatStatus { padding:10px 12px; background:#eef4fa; border-left:4px solid #004481; border-radius:6px; color:#003366; }
.cs-chat-columns { grid-template-columns:minmax(0,1fr) 130px; gap:14px; margin:16px 0; }
#chatMessages { height:380px; border:1px solid #d0d7de; border-radius:8px; padding:14px; background:#f8f9fa; }
#chatMessages p { padding:9px 11px; border-radius:8px; background:white; border:1px solid #e3e8ee; }
#chatMessages strong { color:#004481; }
.cs-chat-columns aside { border:1px solid #d0d7de; border-radius:8px; padding:10px; background:#fff; }
.cs-chat-columns aside h2 { margin:0 0 10px; font-size:14px; color:#004481; }
#chatUsers { padding:0; list-style:none; }
#chatUsers li { padding:6px 0; overflow-wrap:anywhere; }
#chatUsers button { display:block; margin-top:5px; }
#chatSend { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; margin-top:18px; padding:16px; background:#f0f4f8; border:1px solid #d0d7de; border-radius:8px; }
#chatSend .cs-form-row { margin:0; }
#chatText { width:100%; max-width:none; min-height:150px; resize:vertical; padding:12px; border-radius:6px; font-size:14px; line-height:1.6; }
#chatTo { width:100%; max-width:320px; padding:9px; border-radius:6px; }
#chatSend .cs-admin-actions { margin:0; display:flex; flex-wrap:wrap; gap:9px; }
#chatSend button[type="submit"],#chatSend .cs-button:first-child { background:#004481; }
@media(max-width:1100px) and (min-width:769px) {
.cs-offer-body { flex-wrap:wrap; }
.cs-offer-price { margin-left:auto; }
}
@media(max-width:768px) {
.cs-layout { padding:10px; gap:12px; }
.cs-offer-body { flex-wrap:wrap; }
.cs-offer-image { flex-basis:95px; }
.cs-offer-image img { width:95px; height:110px; }
.cs-offer-price { margin-left:auto; }
}
@media(max-width:480px) {
.cs-catalog-table .cs-price-column { width:105px; }
.cs-offer-price { flex-basis:100%; }
.cs-chat-columns { grid-template-columns:minmax(0,1fr); }
#chatUsers { display:flex; flex-wrap:wrap; gap:12px; }
#chatSend { padding:12px; }
#chatTo { max-width:none; }
}
@media(prefers-reduced-motion:reduce) {
.cs-header-title a,.cs-header-title a::after { animation:none; }
.cs-header-title a::after { display:none; }
}

#chatJoin[hidden] { display:none; }
.cs-stats-box,.cs-stats-box .cs-side-title { background:#990000; color:#fff; }
.cs-stats { margin:0; }
.cs-stats > div { display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px; margin-bottom:7px; }
.cs-stats dt,.cs-stats dd { margin:0; }
.cs-stats dd { color:#ffeb3b; font-weight:bold; overflow-wrap:anywhere; }
.cs-stats-ip { border-top:1px solid rgba(255,255,255,.3); padding-top:9px; }
.cs-stats-box small { display:block; margin-top:9px; font-size:10px; }
.cs-news-ticker { flex:1; min-width:0; overflow:hidden; }
.cs-news-ticker-track { display:block; width:max-content; min-width:100%; padding-left:100%; white-space:nowrap; animation:cs-news-scroll 40s linear infinite; }
.cs-news-strip:hover .cs-news-ticker-track,.cs-news-strip:focus-within .cs-news-ticker-track,.cs-news-paused .cs-news-ticker-track { animation-play-state:paused; }
.cs-news-pause { flex:0 0 auto; padding:5px 8px; border:1px solid #fff; border-radius:4px; color:#fff; background:transparent; cursor:pointer; }
@keyframes cs-news-scroll { from { transform:translateX(0); } to { transform:translateX(-100%); } }
@media(prefers-reduced-motion:reduce) {
 .cs-news-ticker-track { animation:none; width:auto; padding-left:0; white-space:normal; }
 .cs-news-pause { display:none; }
}