/* =========================================================================
   Farmacie San Giacomo e San Dario — osm_theme standalone stylesheet
   CS-Cart 4.x custom Italian pharmacy theme — rebuilt 2026-05-13
   Replaces missing /var/cache/misc/assets/design/themes/osm_theme/css/
                    standalone.b95c6ca810684cf4fae8e0a41ea575e8.css
   Bootstrap-2-style 16-column fluid grid, tygh-* / ty-* namespaces, owl carousel.
   ========================================================================= */

/* ---------- 1. CSS variables ---------- */
:root {
    --brand-green:        #2F8168;
    --brand-green-dark:   #1f5b40;
    --brand-green-darker: #143d2b;
    --brand-green-light:  #4ea287;
    --brand-green-soft:   #e8f1ed;
    --brand-accent:       #59B12F;
    --brand-warn:         #EA6E00;
    --brand-text:         #333333;
    --brand-text-muted:   #666666;
    --brand-text-light:   #999999;
    --brand-bg:           #f7f9f7;
    --brand-bg-alt:       #fdfdfd;
    --brand-border:       #dddddd;
    --brand-border-light: #eaeaea;
    --brand-link:         #2F8168;
    --brand-link-hover:   #1f5b40;
    --brand-white:        #ffffff;
    --brand-strike:       #b8b8b8;
    --brand-shadow:       0 2px 6px rgba(0,0,0,.08);
    --brand-shadow-hover: 0 6px 18px rgba(0,0,0,.12);
    --brand-radius:       6px;
    --brand-radius-lg:    10px;
    --brand-transition:   200ms ease;
    --brand-font:         -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                          "Helvetica Neue", Arial, "Noto Sans", sans-serif,
                          "Apple Color Emoji", "Segoe UI Emoji";
    --brand-font-heading: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
                          "Helvetica Neue", Arial, sans-serif;
    --header-max:         1240px;
}

/* ---------- 2. Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
html, body { margin: 0; padding: 0; }
body {
    font-family: var(--brand-font);
    font-size: 16px;
    line-height: 1.55;
    color: var(--brand-text);
    background-color: var(--brand-white);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
img { max-width: 100%; height: auto; border: 0; vertical-align: middle; }
a {
    color: var(--brand-link);
    text-decoration: none;
    transition: color var(--brand-transition);
}
a:hover, a:focus { color: var(--brand-link-hover); text-decoration: underline; }
button { font-family: inherit; cursor: pointer; }
hr {
    border: 0;
    border-top: 1px solid var(--brand-border-light);
    margin: 18px 0;
}
p { margin: 0 0 12px; }
ul, ol { margin: 0 0 12px; padding-left: 24px; }
ul li, ol li { margin-bottom: 6px; }
strong, b { font-weight: 700; }
em, i:not([class]) { font-style: italic; }
small { font-size: 86%; }
.text-center { text-align: center; }
.text-left   { text-align: left; }
.text-right  { text-align: right; }

/* ---------- 3. Typography ---------- */
h1, h2, h3, h4, h5, h6 {
    font-family: var(--brand-font-heading);
    color: var(--brand-green);
    margin: 0 0 14px;
    line-height: 1.25;
    font-weight: 700;
}
h1 { font-size: 1.95rem; letter-spacing: -0.01em; }
h2 { font-size: 1.55rem; }
h3 { font-size: 1.25rem; }
h4 { font-size: 1.1rem; }
h5 { font-size: 1rem; }
h6 { font-size: .92rem; text-transform: uppercase; letter-spacing: .04em; }

@media (min-width: 768px) {
    h1 { font-size: 2.4rem; }
    h2 { font-size: 1.85rem; }
    h3 { font-size: 1.4rem; }
    h4 { font-size: 1.2rem; }
}

/* ---------- 4. Bootstrap-2-style 16-column fluid grid ---------- */
.container-fluid {
    width: 100%;
    max-width: var(--header-max);
    margin: 0 auto;
    padding: 0 16px;
}
.row-fluid {
    width: 100%;
    margin-left: 0;
}
.row-fluid::before, .row-fluid::after { display: table; content: ""; }
.row-fluid::after { clear: both; }

.row-fluid > [class*="span"] {
    display: block;
    float: left;
    width: 100%;
    margin-left: 0;
    box-sizing: border-box;
    min-height: 1px;
}

/* On mobile every span stacks full width */
@media (max-width: 767px) {
    .row-fluid > [class*="span"] {
        width: 100% !important;
        margin-left: 0 !important;
        margin-bottom: 12px;
    }
    .row-fluid > [class*="span"]:last-child { margin-bottom: 0; }
}

/* 16-column responsive grid kicks in at 768px */
@media (min-width: 768px) {
    .row-fluid { margin-left: -1.5%; }
    .row-fluid > [class*="span"] {
        margin-left: 1.5%;
        padding: 0;
    }
    .row-fluid > .span1   { width:  4.75%; }   /* 1/16 */
    .row-fluid > .span2   { width: 11.00%; }
    .row-fluid > .span3   { width: 17.25%; }
    .row-fluid > .span4   { width: 23.50%; }   /* 4/16  ≈ 25% */
    .row-fluid > .span5   { width: 29.75%; }
    .row-fluid > .span6   { width: 36.00%; }   /* 6/16  ≈ 37.5% */
    .row-fluid > .span7   { width: 42.25%; }
    .row-fluid > .span8   { width: 48.50%; }   /* 8/16  = 50% */
    .row-fluid > .span9   { width: 54.75%; }
    .row-fluid > .span10  { width: 61.00%; }
    .row-fluid > .span11  { width: 67.25%; }
    .row-fluid > .span12  { width: 73.50%; }   /* 12/16 = 75% */
    .row-fluid > .span13  { width: 79.75%; }
    .row-fluid > .span14  { width: 86.00%; }
    .row-fluid > .span15  { width: 92.25%; }
    .row-fluid > .span16  { width: 98.50%; }   /* full row */

    .row-fluid > .offset1  { margin-left:  7.75%; }
    .row-fluid > .offset2  { margin-left: 14.00%; }
    .row-fluid > .offset3  { margin-left: 20.25%; }
    .row-fluid > .offset4  { margin-left: 26.50%; }
    .row-fluid > .offset5  { margin-left: 32.75%; }
    .row-fluid > .offset6  { margin-left: 39.00%; }
    .row-fluid > .offset7  { margin-left: 45.25%; }
    .row-fluid > .offset8  { margin-left: 51.50%; }
}

/* Nested rows inside a span don't get the negative gutter again */
.row-fluid .row-fluid { margin-left: 0; }
@media (min-width: 768px) {
    .row-fluid .row-fluid { margin-left: -1.5%; }
}

/* Bootstrap-2 visibility helpers */
.hidden, .ty-hidden { display: none !important; visibility: hidden !important; }
.visible-phone   { display: none !important; }
.hidden-phone    { display: inherit !important; }
.visible-tablet  { display: none !important; }
.hidden-tablet   { display: inherit !important; }
.visible-desktop { display: inherit !important; }
.hidden-desktop  { display: none !important; }

@media (max-width: 767px) {
    .visible-phone   { display: inherit !important; }
    .hidden-phone    { display: none    !important; }
    .visible-desktop { display: none    !important; }
    .hidden-desktop  { display: inherit !important; }
}
@media (min-width: 768px) and (max-width: 1023px) {
    .visible-tablet  { display: inherit !important; }
    .hidden-tablet   { display: none    !important; }
    .visible-desktop { display: none    !important; }
    .hidden-desktop  { display: inherit !important; }
}

/* ---------- 5. Clearfix + float utilities ---------- */
.clearfix::before, .clearfix::after { content: " "; display: table; }
.clearfix::after { clear: both; }
.ty-float-left  { float: left; }
.ty-float-right { float: right; }
.pull-left  { float: left; }
.pull-right { float: right; }

/* ---------- 6. FontAwesome / ty-icon defaults ---------- */
.fa, .fab, .far, .fas, .fal, .fad,
[class^="ty-icon-"], [class*=" ty-icon-"] {
    display: inline-block;
    vertical-align: middle;
    line-height: 1;
    font-style: normal;
}
.ty-icon-search::before        { content: "\1F50D"; }
.ty-icon-down-micro::before    { content: " \25BE"; }
.ty-icon-down-open::before     { content: " \25BE"; }
.ty-icon-up-open::before       { content: " \25B4"; }
.ty-icon-short-list::before    { content: "\2630"; }

/* ---------- 7. Page container ---------- */
.ty-tygh {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    width: 100%;
    overflow-x: hidden;
}
.ty-helper-container,
.index { width: 100%; }

/* ---------- 8. AJAX loaders / notification ---------- */
.ty-ajax-overlay {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,.55);
    z-index: 4998;
    display: none;
}
.ty-ajax-loading-box {
    position: fixed;
    top: 50%; left: 50%;
    transform: translate(-50%,-50%);
    z-index: 4999;
    width: 56px; height: 56px;
    border-radius: 50%;
    border: 4px solid var(--brand-border-light);
    border-top-color: var(--brand-green);
    animation: tyspin 800ms linear infinite;
    display: none;
}
@keyframes tyspin { to { transform: translate(-50%,-50%) rotate(360deg); } }
.cm-notification-container,
.notification-container {
    position: fixed;
    top: 16px;
    right: 16px;
    z-index: 5000;
    max-width: 360px;
}

/* =========================================================================
   9. Top panel (slim utility bar above the main header)
   ========================================================================= */
.tygh-top-panel {
    background: var(--brand-green-darker);
    color: var(--brand-white);
    font-size: 13px;
    padding: 8px 0;
    line-height: 1.4;
}
.tygh-top-panel a,
.tygh-top-panel .ty-wysiwyg-content a,
.tygh-top-panel .ty-text-links__a {
    color: var(--brand-white);
}
.tygh-top-panel a:hover { color: var(--brand-green-soft); text-decoration: underline; }
.tygh-top-panel .recap { padding: 4px 0; }
.tygh-top-panel .ty-wysiwyg-content p { margin: 0; color: var(--brand-white); }
.tygh-top-panel .ty-wysiwyg-content p span { color: var(--brand-white) !important; }
.top-panel,
.top-grid,
.top-links-grid {
    background: transparent;
}

/* Top-panel text-link inline menu */
.ty-text-links-wrapper {
    position: relative;
    text-align: right;
}
.ty-text-links {
    list-style: none;
    padding: 0;
    margin: 0;
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 4px 0;
}
.ty-text-links__item {
    position: relative;
    padding: 0;
    margin: 0;
}
.ty-text-links__item.ty-level-0 > .ty-text-links__a {
    padding: 4px 12px;
    border-right: 1px solid rgba(255,255,255,.18);
    white-space: nowrap;
}
.ty-text-links__item.ty-level-0:last-child > .ty-text-links__a { border-right: 0; }
.ty-text-links__a {
    color: var(--brand-white);
    text-decoration: none;
    display: inline-block;
    padding: 4px 10px;
}
.ty-text-links__a:hover { text-decoration: underline; }
.ty-text-links__subitems { position: relative; }
.ty-text-links__subitems > .ty-text-links {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--brand-green-darker);
    flex-direction: column;
    box-shadow: var(--brand-shadow);
    padding: 6px 0;
    display: none;
    z-index: 1050;
    text-align: left;
}
.ty-text-links__subitems:hover > .ty-text-links,
.ty-text-links__subitems:focus-within > .ty-text-links {
    display: flex;
}
.ty-text-links__item.ty-level-1 > .ty-text-links__a {
    border: 0;
    display: block;
    padding: 6px 14px;
    white-space: nowrap;
}
.ty-text-links__item.ty-level-1 > .ty-text-links__a:hover {
    background: var(--brand-green-dark);
}
.ty-text-links-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 10px;
    cursor: pointer;
}
.ty-text-links-btn__arrow { font-size: .9em; }

/* On mobile the link list collapses behind the burger icon */
@media (max-width: 767px) {
    .ty-text-links-wrapper { text-align: center; }
    .ty-text-links.cm-popup-box {
        display: none;
        position: absolute;
        top: 100%;
        right: 0;
        background: var(--brand-green-darker);
        flex-direction: column;
        align-items: stretch;
        min-width: 220px;
        padding: 6px 0;
        z-index: 1100;
        box-shadow: var(--brand-shadow);
    }
    .ty-text-links.cm-popup-box.active { display: flex; }
    .ty-text-links__item.ty-level-0 > .ty-text-links__a { border-right: 0; }
}

/* =========================================================================
   10. Main header
   ========================================================================= */
.tygh-header {
    background: var(--brand-white);
    border-bottom: 1px solid var(--brand-border-light);
    padding: 18px 0;
}
.header-grid { padding: 0 16px; }
.header_top-links,
.header_left-grid { width: 100%; }
.top-logo-grid    { padding: 8px 0; }

/* Logo container */
.ty-logo-container {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}
.ty-logo-container a {
    display: inline-block;
    line-height: 0;
}
.ty-logo-container__image,
.ty-logo__image {
    max-width: 220px;
    width: auto;
    height: auto;
    max-height: 110px;
}
@media (min-width: 768px) {
    .ty-logo-container__image,
    .ty-logo__image { max-width: 280px; max-height: 130px; }
}

/* Search block in the header */
.search-block-grid {
    padding: 14px 0;
    display: flex;
    align-items: center;
}
.ty-search-block {
    width: 100%;
}
.ty-search-block form {
    position: relative;
    display: flex;
    align-items: stretch;
    width: 100%;
    margin: 0;
}
.ty-search-block__input {
    flex: 1 1 auto;
    width: 100%;
    border: 1px solid var(--brand-border);
    border-right: 0;
    padding: 10px 14px;
    font-size: 15px;
    color: var(--brand-text);
    background: var(--brand-white);
    border-radius: var(--brand-radius) 0 0 var(--brand-radius);
    outline: none;
    transition: border-color var(--brand-transition), box-shadow var(--brand-transition);
}
.ty-search-block__input:focus {
    border-color: var(--brand-green);
    box-shadow: 0 0 0 3px rgba(47,129,104,.18);
}
.ty-search-magnifier {
    flex: 0 0 auto;
    background: var(--brand-green);
    color: var(--brand-white);
    border: 1px solid var(--brand-green);
    padding: 0 18px;
    font-size: 16px;
    border-radius: 0 var(--brand-radius) var(--brand-radius) 0;
    transition: background var(--brand-transition);
}
.ty-search-magnifier:hover {
    background: var(--brand-green-dark);
    border-color: var(--brand-green-dark);
}
.cm-search-bar,
.cm-hint { font-family: inherit; }

.mobile-srch { padding-top: 10px; }

/* Right column of header (cart) */
.header_ryt-grid {
    display: flex;
    align-items: center;
    justify-content: flex-end;
}
.top-cart-content {
    min-height: 32px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    color: var(--brand-text-muted);
    font-size: 14px;
}

/* =========================================================================
   11. Main content area
   ========================================================================= */
.tygh-content {
    background: var(--brand-white);
    padding: 18px 16px 30px;
    flex: 1 0 auto;
    max-width: var(--header-max);
    margin: 0 auto;
    width: 100%;
}
@media (min-width: 768px) {
    .tygh-content { padding: 30px 24px 50px; }
}
@media (min-width: 1024px) {
    .tygh-content { padding: 40px 24px 60px; }
}
.content-grid {
    padding: 0 16px;
}
.tygh-content__no-sidebar { width: 100%; }
.ty-content {
    width: 100%;
    margin: 0 auto;
}

/* Generic spacing between rows of content */
.tygh-content .row-fluid + .row-fluid { margin-top: 18px; }
@media (min-width: 768px) { .tygh-content .row-fluid + .row-fluid { margin-top: 26px; } }

/* "All services" link at the bottom of the homepage services grid */
#btn-more {
    text-align: center;
    margin: 8px auto 28px;
}
#btn-more a {
    display: inline-block;
    padding: 12px 28px;
    background: var(--brand-green);
    color: var(--brand-white);
    border-radius: var(--brand-radius-pill, 999px);
    font-weight: 600;
    font-size: 15px;
    text-decoration: none;
    transition: background var(--brand-transition), transform var(--brand-transition), box-shadow var(--brand-transition);
}
#btn-more a:hover {
    background: var(--brand-green-dark);
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(47, 129, 104, 0.25);
}

/* App-download promo banner (homepage) */
.app-download {
    margin: 30px auto;
}
.app-download .app-wrap {
    background: linear-gradient(135deg, #e8f4ee 0%, #f7f9f7 100%);
    border-radius: var(--brand-radius-lg);
    padding: 32px 24px;
}
.app-download .phone-section {
    max-width: 1100px;
    margin: 0 auto;
}
.app-download .app-grid { width: 100%; }
.app-download .row-app {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 30px;
    justify-content: center;
}
.app-download .app-items {
    flex: 1 1 320px;
    min-width: 280px;
}
.app-download .app-text h4 {
    font-size: 22px;
    color: var(--brand-green-dark);
    margin: 0 0 8px;
}
.app-download .app-text h4 span {
    color: var(--brand-green);
    font-weight: 600;
}
.app-download .app-text hr {
    border: none;
    border-top: 2px solid var(--brand-green);
    width: 50px;
    margin: 8px 0 14px;
}
.app-download .app-text p { line-height: 1.55; margin: 8px 0; }
.app-download .app-text ul {
    margin: 10px 0 14px 20px;
    padding: 0;
}
.app-download .app-text ul li {
    margin-bottom: 6px;
    line-height: 1.45;
}
.app-download .app-btn-download {
    margin-top: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.app-download .app-btn-download h5 {
    margin: 0;
    font-size: 14px;
    color: var(--brand-text);
    font-weight: 600;
}
.app-download .app-btn-download a {
    display: inline-block;
    margin-right: 8px;
    margin-top: 4px;
}
.app-download .app-btn-download img {
    height: 48px;
    width: auto;
    vertical-align: middle;
}
.app-download .app-items.app-image,
.app-download .app-items.app-img {
    text-align: center;
}
.app-download .app-items.app-image img,
.app-download .app-items.app-img img {
    max-width: 280px;
    width: 100%;
    height: auto;
}
@media (max-width: 768px) {
    .app-download .app-wrap { padding: 20px 14px; }
    .app-download .app-text h4 { font-size: 18px; }
}

/* =========================================================================
   12. WYSIWYG content (rich-text article body)
   ========================================================================= */
.ty-wysiwyg-content {
    color: var(--brand-text);
    font-size: 1rem;
    line-height: 1.65;
}
.ty-wysiwyg-content h1 {
    color: var(--brand-green);
    margin: 14px 0 18px;
    line-height: 1.2;
}
.ty-wysiwyg-content h2 {
    color: var(--brand-green);
    margin: 28px 0 12px;
    padding-bottom: 6px;
    border-bottom: 2px solid var(--brand-green-soft);
}
.ty-wysiwyg-content h3 {
    color: var(--brand-green);
    margin: 22px 0 10px;
}
.ty-wysiwyg-content h4 {
    color: var(--brand-green-dark);
    margin: 18px 0 8px;
}
.ty-wysiwyg-content p {
    margin: 0 0 14px;
}
.ty-wysiwyg-content ul,
.ty-wysiwyg-content ol {
    margin: 0 0 16px;
    padding-left: 26px;
}
.ty-wysiwyg-content ul li,
.ty-wysiwyg-content ol li {
    margin-bottom: 8px;
}
.ty-wysiwyg-content ul li::marker { color: var(--brand-green); }
.ty-wysiwyg-content a {
    color: var(--brand-green);
    border-bottom: 1px solid rgba(47,129,104,.25);
    transition: color var(--brand-transition), border-color var(--brand-transition);
}
.ty-wysiwyg-content a:hover {
    color: var(--brand-green-dark);
    border-bottom-color: var(--brand-green-dark);
    text-decoration: none;
}
.ty-wysiwyg-content blockquote {
    margin: 18px 0;
    padding: 12px 18px;
    border-left: 4px solid var(--brand-green);
    background: var(--brand-green-soft);
    font-style: italic;
    color: var(--brand-text);
}
.ty-wysiwyg-content hr {
    margin: 20px auto;
    border-top: 1px solid var(--brand-border-light);
    max-width: 80%;
}
.ty-wysiwyg-content img {
    border-radius: var(--brand-radius);
    box-shadow: var(--brand-shadow);
    margin: 10px 0;
}

/* "contatti" section accent block used on the homepage */
.contatti-section {
    margin: 18px 0;
    padding: 14px 16px;
    background: var(--brand-bg);
    border-radius: var(--brand-radius);
    border-top: 3px solid var(--brand-green);
}
.contatti-section hr { display: none; }
.contatti-section p { margin: 6px 0; }
.contatti-section a { font-weight: 600; }

/* Tabs / promotional headings used on the homepage */
.tabs_block {
    margin: 24px 0 10px;
    text-align: center;
}
.tabs_block h3 {
    font-size: 1.5rem;
    margin: 0;
    color: var(--brand-green);
}
.btn-more.servizio-cont h2 {
    color: var(--brand-green);
    text-align: left;
    margin-top: 0;
}

/* =========================================================================
   13. Buttons
   ========================================================================= */
.ty-btn,
.ty-btn__primary,
button.ty-btn,
a.ty-btn {
    display: inline-block;
    padding: 10px 22px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center;
    text-decoration: none;
    border-radius: var(--brand-radius);
    background: var(--brand-green);
    color: var(--brand-white) !important;
    border: 1px solid var(--brand-green);
    cursor: pointer;
    transition: background var(--brand-transition),
                border-color var(--brand-transition),
                color var(--brand-transition),
                box-shadow var(--brand-transition),
                transform var(--brand-transition);
    box-shadow: 0 1px 2px rgba(0,0,0,.05);
}
.ty-btn:hover,
.ty-btn__primary:hover,
a.ty-btn:hover {
    background: var(--brand-green-dark);
    border-color: var(--brand-green-dark);
    color: var(--brand-white) !important;
    text-decoration: none;
    box-shadow: var(--brand-shadow);
    transform: translateY(-1px);
}
.ty-btn:active { transform: translateY(0); box-shadow: none; }
.ty-btn h4,
.ty-btn h3 {
    color: var(--brand-white) !important;
    margin: 0;
    font-size: 1rem;
}

/* Secondary / outline variant */
.ty-btn-secondary,
.ty-btn__secondary,
a.ty-btn-secondary {
    background: transparent;
    color: var(--brand-green) !important;
    border: 1.5px solid var(--brand-green);
}
.ty-btn-secondary:hover {
    background: var(--brand-green);
    color: var(--brand-white) !important;
    border-color: var(--brand-green);
}

/* Add-to-cart styling */
.ty-btn-add-to-cart,
.ty-btn__add-to-cart {
    background: var(--brand-warn);
    border-color: var(--brand-warn);
    color: var(--brand-white) !important;
    border-radius: 999px;
    padding: 11px 26px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase;
    font-size: 13px;
}
.ty-btn-add-to-cart:hover,
.ty-btn__add-to-cart:hover {
    background: #c45c00;
    border-color: #c45c00;
}

.ty-btn[disabled],
.ty-btn.disabled {
    opacity: .55;
    cursor: not-allowed;
    transform: none;
}

/* =========================================================================
   14. Product / scroller cards (homepage carousel of offers)
   ========================================================================= */
.our_products-grid,
.offer_banners_grid,
.index_common_wid {
    margin-top: 14px;
}
.banners {
    width: 100%;
    overflow: hidden;
    border-radius: var(--brand-radius);
}
.ty-banner__image-item {
    width: 100%;
}
.ty-banner__image {
    width: 100%;
    height: auto;
    display: block;
    border-radius: var(--brand-radius);
}

.ty-scroller-list {
    margin: 0;
    padding: 6px 0;
}
.ty-scroller-list__item {
    background: var(--brand-white);
    border: 1px solid var(--brand-border-light);
    border-radius: var(--brand-radius-lg);
    padding: 14px;
    margin: 6px;
    text-align: center;
    transition: box-shadow var(--brand-transition),
                transform var(--brand-transition),
                border-color var(--brand-transition);
    box-shadow: 0 1px 2px rgba(0,0,0,.03);
    position: relative;
}
.ty-scroller-list__item:hover {
    box-shadow: var(--brand-shadow-hover);
    transform: translateY(-2px);
    border-color: var(--brand-green-soft);
}
.ty-scroller-list__img-block {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    margin-bottom: 12px;
    background: var(--brand-bg);
    border-radius: var(--brand-radius);
}
.ty-scroller-list__img-block img {
    max-width: 100%;
    max-height: 100%;
    width: auto;
    height: auto;
    object-fit: contain;
    transition: transform var(--brand-transition);
}
.ty-scroller-list__item:hover .ty-scroller-list__img-block img {
    transform: scale(1.04);
}
.ty-scroller-list__description {
    font-size: 14px;
}

/* Product simple list (titles, price, controls inside cards) */
.ty-simple-list {
    text-align: center;
    font-size: 14px;
}
.product-title,
a.product-title {
    display: block;
    margin: 6px 0 8px;
    font-weight: 600;
    color: var(--brand-text);
    font-size: 14px;
    line-height: 1.35;
    text-decoration: none;
    min-height: 38px;
    border: 0;
}
.product-title:hover,
a.product-title:hover {
    color: var(--brand-green);
    text-decoration: underline;
}

/* Price line */
.ty-simple-list__price {
    margin: 6px 0;
    text-align: center;
    font-size: 15px;
}
.ty-list-price { color: var(--brand-text-light); margin-right: 4px; }
.ty-strike      { text-decoration: line-through; color: var(--brand-strike); }
.ty-price       { color: var(--brand-warn); font-weight: 700; font-size: 17px; }
.ty-price-num   { color: var(--brand-warn); font-weight: 700; }
.ty-nowrap      { white-space: nowrap; }

/* Discount labels (Risparmia X%) */
.ty-product-labels {
    position: absolute;
    z-index: 5;
    pointer-events: none;
}
.ty-product-labels--top-right { top: 8px; right: 8px; }
.ty-product-labels--top-left  { top: 8px; left:  8px; }
.ty-product-labels__item {
    background: var(--brand-warn);
    color: var(--brand-white);
    padding: 4px 9px;
    font-size: 12px;
    font-weight: 700;
    border-radius: var(--brand-radius);
    box-shadow: 0 1px 3px rgba(0,0,0,.15);
    margin-bottom: 4px;
}
.ty-product-labels__item--discount { background: var(--brand-warn); }
.ty-product-labels__content { line-height: 1; }

/* Buttons block under the price */
.ty-simple-list__buttons,
.ty-product__buttons {
    margin-top: 10px;
    text-align: center;
}
.simple_list_in { width: 100%; }

/* Product detail buttons (PDP) */
.ty-product__buttons .ty-btn {
    width: 100%;
}

/* Grid list (category pages) */
.ty-grid-list__item {
    background: var(--brand-white);
    border: 1px solid var(--brand-border-light);
    border-radius: var(--brand-radius-lg);
    padding: 14px;
    margin-bottom: 16px;
    text-align: center;
    transition: box-shadow var(--brand-transition), transform var(--brand-transition);
}
.ty-grid-list__item:hover {
    box-shadow: var(--brand-shadow-hover);
    transform: translateY(-2px);
}
.ty-grid-list__image {
    border-radius: var(--brand-radius);
    margin-bottom: 10px;
}

/* =========================================================================
   15. Owl carousel (lightweight rebuild — covers the markup we use)
   ========================================================================= */
.owl-carousel {
    display: block;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    position: relative;
}
.owl-carousel .owl-stage-outer {
    position: relative;
    overflow: hidden;
    transform: translate3d(0,0,0);
}
.owl-carousel .owl-stage {
    position: relative;
    -webkit-backface-visibility: hidden;
    display: flex;
    transition: transform 350ms ease;
}
.owl-carousel .owl-item {
    flex: 0 0 auto;
    position: relative;
    min-height: 1px;
    -webkit-backface-visibility: hidden;
    -webkit-user-select: none;
    user-select: none;
}
.owl-carousel .owl-item img {
    display: block;
    width: 100%;
    height: auto;
}
/* Pre-init fallback: items behave as a CSS scroller until JS initialises */
.owl-carousel:not(.owl-loaded) {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -ms-overflow-style: none;
    scrollbar-width: none;
    gap: 12px;
    padding-bottom: 6px;
}
.owl-carousel:not(.owl-loaded)::-webkit-scrollbar { display: none; }
.owl-carousel:not(.owl-loaded) > * {
    flex: 0 0 auto;
    width: 84%;
    scroll-snap-align: start;
}
@media (min-width: 600px)  {
    .owl-carousel:not(.owl-loaded) > * { width: 48%; }
}
@media (min-width: 900px)  {
    .owl-carousel:not(.owl-loaded) > * { width: 31%; }
}
@media (min-width: 1100px) {
    .owl-carousel:not(.owl-loaded) > * { width: 23%; }
}
/* When the homepage's main banner slider is in this CSS-only fallback,
   show only the first slide to avoid a side-by-side row of full-bleed banners. */
.banners.owl-carousel:not(.owl-loaded) > .ty-banner__image-item ~ .ty-banner__image-item {
    display: none;
}

.owl-carousel .owl-nav { margin-top: 8px; text-align: center; }
.owl-carousel .owl-nav button.owl-prev,
.owl-carousel .owl-nav button.owl-next {
    background: var(--brand-green);
    color: var(--brand-white);
    border: 0;
    border-radius: 50%;
    width: 32px; height: 32px;
    margin: 0 4px;
    line-height: 32px;
    font-size: 16px;
    transition: background var(--brand-transition);
}
.owl-carousel .owl-nav button:hover { background: var(--brand-green-dark); }
.owl-carousel .owl-dots {
    text-align: center;
    margin-top: 8px;
}
.owl-carousel .owl-dot {
    display: inline-block;
    width: 8px; height: 8px;
    margin: 0 4px;
    border-radius: 50%;
    background: var(--brand-border);
    border: 0;
    transition: background var(--brand-transition);
}
.owl-carousel .owl-dot.active { background: var(--brand-green); }
.lazyOwl { opacity: 1; transition: opacity 250ms ease; }

/* =========================================================================
   16. Menus (CS-Cart side menu + minor variants)
   ========================================================================= */
.ty-menu {
    background: transparent;
}
.ty-menu__items,
.ty-menu__submenu {
    list-style: none;
    padding: 0;
    margin: 0;
}
.ty-menu__item {
    position: relative;
    margin: 0;
}
.ty-menu__item-link,
.ty-menu__submenu-item-header {
    display: block;
    padding: 8px 14px;
    color: var(--brand-text);
    font-weight: 500;
    transition: background var(--brand-transition), color var(--brand-transition);
    cursor: pointer;
}
.ty-menu__item-link:hover,
.ty-menu__submenu-item-header:hover,
.ty-menu__item.open > .ty-menu__submenu-item-header {
    background: var(--brand-green-soft);
    color: var(--brand-green-dark);
    text-decoration: none;
}
.ty-menu__submenu {
    display: none;
    background: var(--brand-white);
    border: 1px solid var(--brand-border-light);
    border-radius: var(--brand-radius);
    box-shadow: var(--brand-shadow);
    padding: 6px 0;
    margin-top: 2px;
}
.ty-menu__submenu.open {
    display: block;
}
.ty-menu__submenu-link {
    display: block;
    padding: 6px 18px;
    color: var(--brand-text);
}
.ty-menu__submenu-link:hover { background: var(--brand-green-soft); color: var(--brand-green-dark); }

/* =========================================================================
   17. Forms
   ========================================================================= */
.input-text,
.input-textarea,
input[type="text"]:not(.ty-search-block__input),
input[type="email"],
input[type="password"],
input[type="tel"],
input[type="url"],
input[type="number"],
input[type="search"],
textarea,
select {
    display: inline-block;
    width: 100%;
    max-width: 480px;
    padding: 10px 12px;
    font-family: inherit;
    font-size: 15px;
    color: var(--brand-text);
    background: var(--brand-white);
    border: 1px solid var(--brand-border);
    border-radius: var(--brand-radius);
    outline: none;
    transition: border-color var(--brand-transition), box-shadow var(--brand-transition);
}
textarea { min-height: 120px; resize: vertical; }
input:focus,
textarea:focus,
select:focus {
    border-color: var(--brand-green);
    box-shadow: 0 0 0 3px rgba(47,129,104,.15);
}
label {
    display: inline-block;
    margin-bottom: 6px;
    font-weight: 600;
    color: var(--brand-text);
}
.cm-form .control-group,
.cm-form .form-group {
    margin-bottom: 14px;
}

/* =========================================================================
   18. Tables
   ========================================================================= */
.ty-table {
    width: 100%;
    border-collapse: collapse;
    margin: 16px 0;
    background: var(--brand-white);
    box-shadow: var(--brand-shadow);
    border-radius: var(--brand-radius);
    overflow: hidden;
    font-size: 14px;
}
.ty-table th,
.ty-table td {
    padding: 10px 14px;
    text-align: left;
    border-bottom: 1px solid var(--brand-border-light);
    vertical-align: top;
}
.ty-table th {
    background: var(--brand-green-soft);
    color: var(--brand-green-dark);
    font-weight: 700;
}
.ty-table tr:nth-child(even) td { background: var(--brand-bg); }
.ty-table tr:last-child td { border-bottom: 0; }

/* =========================================================================
   19. Search popup item (autocomplete)
   ========================================================================= */
.ty-search-item {
    display: flex;
    align-items: center;
    padding: 8px 10px;
    border-bottom: 1px solid var(--brand-border-light);
    background: var(--brand-white);
}
.ty-search-item:hover { background: var(--brand-green-soft); }
.ty-search-item__picture { flex: 0 0 48px; margin-right: 10px; }
.ty-search-item__picture img { max-width: 48px; max-height: 48px; }
.ty-search-item__information {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
}
.ty-search-item__title {
    font-weight: 600;
    color: var(--brand-text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ty-search-item__product-code { font-size: 12px; color: var(--brand-text-light); }
.ty-search-item__price { font-weight: 700; color: var(--brand-warn); }

/* =========================================================================
   20. Footer
   ========================================================================= */
.tygh-footer {
    background: var(--brand-green-dark);
    color: var(--brand-white);
    padding: 36px 0 0;
    margin-top: 30px;
}
.tygh-footer a {
    color: var(--brand-white);
    text-decoration: none;
    transition: opacity var(--brand-transition), color var(--brand-transition);
}
.tygh-footer a:hover { opacity: .8; text-decoration: underline; }
.ty-footer-grid { padding: 0 16px; }
.ty-footer-grid__full-width { width: 100%; }
.ty-footer-menu .row-fluid {
    display: flex;
    flex-wrap: wrap;
    gap: 18px 0;
}
.ty-footer-menu .span6,
.ty-footer-menu .span5 {
    padding: 8px 0;
}

.ty-footer h2,
.ty-footer h3,
.ty-footer h4,
.ty-footer-general__header {
    color: var(--brand-white);
    margin: 0 0 12px;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: .04em;
    border-bottom: 2px solid rgba(255,255,255,.18);
    padding-bottom: 6px;
}
.ty-footer-general__header { cursor: pointer; }
.ty-footer-general__header .ty-footer-menu__icon-open,
.ty-footer-general__header .ty-footer-menu__icon-hide { float: right; font-size: .9em; }
.ty-footer-menu__icon-hide { display: none; }
.ty-footer.active .ty-footer-menu__icon-open { display: none; }
.ty-footer.active .ty-footer-menu__icon-hide { display: inline-block; }

.ty-footer-general__body p {
    margin: 6px 0;
    line-height: 1.5;
}
.ty-footer-general__body a span {
    color: var(--brand-white) !important;
}

/* About / address columns */
.about-grid p { color: var(--brand-white); margin: 6px 0; }
.about-grid a { color: var(--brand-white); }
.footer-logo-grid {
    padding: 4px 0;
}
.foot_adres {
    color: var(--brand-white);
    line-height: 1.55;
    font-size: 14.5px;
}
.foot_adres h4 {
    color: var(--brand-white);
    font-size: 1.05rem;
    margin: 0 0 10px;
    text-transform: uppercase;
    letter-spacing: .03em;
    border-bottom: 2px solid rgba(255,255,255,.18);
    padding-bottom: 6px;
}
.foot_adres p { margin: 4px 0; color: var(--brand-white); }
.foot_adres a { color: var(--brand-white); border-bottom: 1px dotted rgba(255,255,255,.4); }
.foot_adres a:hover { border-bottom-color: rgba(255,255,255,.9); }

/* Social icons row */
.nws_soc_apps {
    margin-top: 14px;
}
.nws_soc_apps ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    gap: 8px;
}
.nws_soc_apps li { margin: 0; }
.nws_soc_apps a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border: 1px solid rgba(255,255,255,.6);
    border-radius: 50%;
    color: var(--brand-white);
    font-size: 16px;
    transition: background var(--brand-transition),
                color var(--brand-transition),
                border-color var(--brand-transition),
                transform var(--brand-transition);
}
.nws_soc_apps a:hover {
    background: var(--brand-white);
    color: var(--brand-green-dark);
    border-color: var(--brand-white);
    transform: translateY(-1px);
    text-decoration: none;
}

/* Copyright bottom strip */
.footer-copyright {
    background: var(--brand-green-darker);
    margin-top: 26px;
    padding: 14px 0;
    color: rgba(255,255,255,.85);
    font-size: 13px;
    line-height: 1.5;
    text-align: center;
}
.footer-copyright a { color: var(--brand-white); text-decoration: underline; }
.footer-copyright a:hover { color: var(--brand-green-soft); }
.copy_right p { margin: 0; color: rgba(255,255,255,.85); }

/* =========================================================================
   21. Misc utility / state
   ========================================================================= */
.recap { font-size: 14px; }
.cm-combination { cursor: pointer; }
.cm-popup-box { position: relative; }

/* "ty-pict" generic image */
.ty-pict {
    display: inline-block;
    max-width: 100%;
    height: auto;
}
.cm-image {
    transition: opacity var(--brand-transition);
}

/* "btn-more servizio-cont" panel for promoted snippets */
.btn-more {
    background: var(--brand-green-soft);
    border-left: 4px solid var(--brand-green);
    padding: 10px 14px;
    border-radius: var(--brand-radius);
    margin: 8px 0;
}
.btn-more h2 {
    color: var(--brand-green-dark) !important;
    margin: 0;
    border: 0;
    padding: 0;
    text-transform: none;
    letter-spacing: 0;
    font-size: 1.2rem;
}

/* Homepage services grid */
.grid-servizi {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 18px;
    max-width: 1240px;
    margin: 28px auto 40px;
    padding: 0 20px;
}
.grid-servizi a {
    display: block;
    color: inherit;
    text-decoration: none;
}
.grid-servizi a:focus { outline: none; }
.grid-servizi .spec-cover {
    background: var(--brand-white);
    border: 1px solid var(--brand-border);
    border-radius: var(--brand-radius-lg);
    padding: 22px 14px 18px;
    text-align: center;
    transition: border-color var(--brand-transition),
                box-shadow var(--brand-transition),
                transform var(--brand-transition);
    min-height: 175px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.grid-servizi a:hover .spec-cover {
    border-color: var(--brand-green);
    box-shadow: 0 6px 18px rgba(47, 129, 104, 0.14);
    transform: translateY(-3px);
}
.grid-servizi .servizi-child {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px;
    transition: transform 350ms ease;
    will-change: transform;
}
.grid-servizi .servizi-child img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    flex-shrink: 0;
}
.grid-servizi .servizi-child h4 {
    margin: 0;
    color: var(--brand-green-dark);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.3;
    letter-spacing: 0;
}
@media (max-width: 480px) {
    .grid-servizi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        padding: 0 12px;
    }
    .grid-servizi .spec-cover { padding: 16px 8px 14px; min-height: 150px; }
    .grid-servizi .servizi-child img { width: 48px; height: 48px; }
    .grid-servizi .servizi-child h4 { font-size: 12px; }
}

/* Servizi child block (homepage hover-scale target — base, generalized) */
.spec-cover {
    position: relative;
    overflow: hidden;
    border-radius: var(--brand-radius);
}
.servizi-child {
    transition: transform 350ms ease;
    will-change: transform;
}

/* Product detail page tabs */
#product_tab,
.product-tab1, .product-tab2, .product-tab3,
.product-tab4, .product-tab5, .product-tab6 {
    list-style: none;
    padding: 0;
    margin: 0;
}
#product_tab {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    border-bottom: 1px solid var(--brand-border);
    margin: 18px 0 0;
}
#product_tab li {
    padding: 8px 14px;
    border: 1px solid transparent;
    border-bottom: 0;
    border-radius: var(--brand-radius) var(--brand-radius) 0 0;
    cursor: pointer;
    background: var(--brand-bg);
    color: var(--brand-text);
    transition: background var(--brand-transition), color var(--brand-transition);
}
#product_tab li:hover { background: var(--brand-green-soft); }
#product_tab li.active {
    background: var(--brand-white);
    border-color: var(--brand-border);
    color: var(--brand-green-dark);
    font-weight: 600;
}

/* Loading hint helper */
.cm-hint { color: var(--brand-text); }

/* "ty-hidden cm-es-item-example" — keep collapsed off-screen template */
.ty-hidden,
.cm-es-item-example { display: none !important; }

/* Notifications (success / warning / error) */
.ty-notification {
    background: var(--brand-white);
    border: 1px solid var(--brand-border-light);
    border-left: 4px solid var(--brand-green);
    padding: 10px 14px;
    border-radius: var(--brand-radius);
    margin-bottom: 8px;
    box-shadow: var(--brand-shadow);
    font-size: 14px;
}
.ty-notification--error   { border-left-color: #d9534f; }
.ty-notification--warning { border-left-color: var(--brand-warn); }
.ty-notification--success { border-left-color: var(--brand-accent); }

/* =========================================================================
   22. Responsive tweaks for the header layout
   ========================================================================= */
@media (max-width: 767px) {
    .tygh-top-panel { font-size: 12.5px; padding: 6px 0; }
    .tygh-header    { padding: 12px 0; }
    .top-logo-grid  { padding: 4px 0; text-align: center; }
    .ty-logo-container { justify-content: center; }
    .ty-logo-container__image { max-height: 78px; }
    .search-block-grid { display: none; }   /* mobile uses .mobile-srch */
    .header_ryt-grid   { justify-content: center; padding-top: 6px; }
    .top-cart-content  { justify-content: center; }
    .ty-search-block__input { font-size: 16px; }   /* avoid iOS zoom */
}

@media (min-width: 1240px) {
    .container-fluid { padding: 0 0; }
    .header-grid,
    .content-grid,
    .ty-footer-grid { padding: 0; }
}

/* =========================================================================
   23. Print
   ========================================================================= */
@media print {
    .tygh-top-panel,
    .tygh-header form,
    .ty-search-block,
    .tygh-footer,
    .nws_soc_apps,
    .owl-nav,
    .owl-dots,
    .ty-btn { display: none !important; }
    body { background: #fff; color: #000; }
    a { color: #000; text-decoration: underline; }
    .tygh-content { padding: 0; }
    h1, h2, h3, h4 { color: #000 !important; border-color: #000 !important; }
}

/* =========================================================================
   24. Accessibility — focus visibility
   ========================================================================= */
a:focus-visible,
button:focus-visible,
.ty-btn:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
    outline: 2px solid var(--brand-green);
    outline-offset: 2px;
}

/* =========================================================================
   25. End of stylesheet
   ========================================================================= */
