/* ==========================================================================
   TRINDADE PEÇAS - TEMA BRANCO / PRETO / VERDE
   OpenCart 3.0.5.0 + Bootstrap 3
   ========================================================================== */

:root {
    --tb-green: #18c83e;
    --tb-green-dark: #11942f;
    --tb-green-soft: #effbf2;
    --tb-black: #111111;
    --tb-black-soft: #1b1b1b;
    --tb-text: #222222;
    --tb-muted: #707070;
    --tb-border: #e7e7e7;
    --tb-light: #f7f7f7;
    --tb-white: #ffffff;
}

html,
body {
    background: var(--tb-white);
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: var(--tb-text);
    font-size: 13px;
    line-height: 1.5;
}

a {
    color: var(--tb-green-dark);
    transition: all .18s ease;
}

a:hover,
a:focus {
    color: var(--tb-green);
    text-decoration: none;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--tb-black);
    font-weight: 600;
}

/* ==========================================================================
   TOPBAR
   ========================================================================== */

#tb-topbar {
    background: var(--tb-black);
    color: #e7e7e7;
    font-size: 12px;
    border-bottom: 1px solid #262626;
}

.tb-topbar-inner {
    min-height: 36px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.tb-topbar-left,
.tb-topbar-right {
    display: flex;
    align-items: center;
}

.tb-topbar-left a,
.tb-topbar-left span {
    color: #e7e7e7;
}

.tb-topbar-left a:hover {
    color: var(--tb-green);
}

.tb-topbar-left i {
    color: var(--tb-green);
    margin-right: 6px;
    font-size: 14px;
}

.tb-topbar-note {
    margin-left: 18px;
    color: #bcbcbc;
}

#tb-topbar .list-inline {
    margin: 0;
}

#tb-topbar .list-inline > li {
    padding: 0;
    margin-left: 16px;
}

#tb-topbar a {
    color: #e7e7e7;
}

#tb-topbar a:hover,
#tb-topbar a:focus {
    color: var(--tb-green);
}

#tb-topbar .dropdown-menu {
    right: 0;
    left: auto;
    min-width: 190px;
    padding: 8px 0;
    border: 1px solid var(--tb-border);
    border-radius: 4px;
    box-shadow: 0 8px 24px rgba(0,0,0,.10);
}

#tb-topbar .dropdown-menu > li > a {
    color: var(--tb-text);
    padding: 8px 16px;
}

#tb-topbar .dropdown-menu > li > a:hover {
    background: var(--tb-green-soft);
    color: var(--tb-green-dark);
}

/* ==========================================================================
   HEADER
   ========================================================================== */

#tb-header {
    background: var(--tb-white);
    border-bottom: 0;
}

.tb-main-header {
    background: var(--tb-white);
}

.tb-header-inner {
    min-height: 96px;
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 18px 0;
}

.tb-logo {
    flex: 0 0 auto;
}

#logo img {
    max-height: 66px;
    max-width: 230px;
    width: auto;
}

.tb-logo-text {
    font-size: 24px;
    font-weight: 700;
    color: var(--tb-black);
}

/* Search */
#search,
.tb-search {
    flex: 1 1 auto;
    max-width: 720px;
    margin: 0;
}

#search .input-group,
.tb-search .input-group {
    width: 100%;
}

#search .form-control,
.tb-search .form-control {
    height: 46px;
    background: #fff;
    border: 1px solid #dcdcdc;
    border-right: 0;
    border-radius: 6px 0 0 6px;
    box-shadow: none;
    font-size: 13px;
    color: var(--tb-text);
    padding: 10px 15px;
}

#search .form-control:focus,
.tb-search .form-control:focus {
    border-color: var(--tb-green);
    box-shadow: 0 0 0 2px rgba(24,200,62,.08);
}

#tb-button-search {
    height: 46px;
    min-width: 112px;
    padding: 0 18px;
    background: var(--tb-green);
    border: 1px solid var(--tb-green);
    border-radius: 0 6px 6px 0;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
}

#tb-button-search i {
    margin-right: 6px;
}

#tb-button-search:hover,
#tb-button-search:focus {
    background: var(--tb-green-dark);
    border-color: var(--tb-green-dark);
    color: #fff;
}

/* Header actions */
.tb-header-actions {
    display: flex;
    align-items: center;
    gap: 18px;
    flex: 0 0 auto;
    white-space: nowrap;
}

.tb-action {
    color: var(--tb-black);
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.tb-action i {
    color: var(--tb-green);
    font-size: 17px;
}

.tb-action:hover {
    color: var(--tb-green-dark);
}

.tb-cart-wrap {
    position: relative;
}

#cart {
    margin-bottom: 0;
}

#cart > button,
#cart > .btn {
    min-height: 42px;
    background: var(--tb-black);
    color: #fff;
    border: 1px solid var(--tb-black);
    border-radius: 6px;
    padding: 9px 14px;
    font-weight: 600;
}

#cart > button:hover,
#cart > .btn:hover,
#cart.open > button,
#cart.open > .btn {
    background: var(--tb-green-dark);
    border-color: var(--tb-green-dark);
}

#cart .dropdown-menu {
    min-width: 330px;
    border: 1px solid var(--tb-border);
    box-shadow: 0 10px 28px rgba(0,0,0,.12);
}

/* ==========================================================================
   NAV / CATEGORIAS
   ========================================================================== */

#tb-nav {
    background: var(--tb-black);
    border-top: 1px solid #202020;
    border-bottom: 3px solid var(--tb-green);
}

.tb-nav-inner {
    position: relative;
}

.tb-nav-list {
    margin: 0;
    padding: 0;
    display: flex;
    align-items: stretch;
    flex-wrap: wrap;
}

.tb-nav-list > li {
    float: none;
    display: block;
}

.tb-nav-list > li > a {
    color: #fff;
    padding: 15px 16px;
    font-size: 13px;
    font-weight: 600;
    background: transparent;
}

.tb-nav-list > li > a:hover,
.tb-nav-list > li > a:focus,
.tb-nav-list > li.open > a {
    color: var(--tb-green);
    background: var(--tb-black-soft);
}

.tb-home-link > a {
    color: var(--tb-green) !important;
}

.tb-nav-toggle {
    width: 100%;
    text-align: left;
    background: var(--tb-black);
    color: #fff;
    border: 0;
    padding: 14px 16px;
    font-weight: 600;
}

.tb-nav-toggle i {
    color: var(--tb-green);
    margin-right: 8px;
}

.tb-mega-menu {
    min-width: 540px;
    border: 0;
    border-top: 3px solid var(--tb-green);
    border-radius: 0 0 6px 6px;
    padding: 18px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(0,0,0,.14);
}

.tb-mega-menu ul {
    list-style: none;
    margin: 0;
    padding: 0 15px;
}

.tb-mega-menu li a {
    display: block;
    padding: 7px 0;
    color: var(--tb-text);
}

.tb-mega-menu li a:hover {
    color: var(--tb-green-dark);
    padding-left: 4px;
}

/* ==========================================================================
   CONTEÚDO GERAL
   ========================================================================== */

.container {
    max-width: 1200px;
}

#content {
    min-height: 300px;
}

#content h1,
.page-title {
    position: relative;
    border: 0;
    padding-bottom: 12px;
    margin-bottom: 22px;
    font-size: 24px;
    font-weight: 700;
}

#content h1:after,
.page-title:after {
    content: "";
    display: block;
    width: 56px;
    height: 3px;
    background: var(--tb-green);
    margin-top: 10px;
    border-radius: 3px;
}

.breadcrumb {
    background: transparent;
    padding: 14px 0;
    margin-bottom: 10px;
    font-size: 12px;
}

.breadcrumb > li > a {
    color: var(--tb-muted);
}

.breadcrumb > li:last-child,
.breadcrumb > li:last-child a {
    color: var(--tb-green-dark);
}

.panel {
    border-color: var(--tb-border);
    box-shadow: none;
}

.panel-default > .panel-heading {
    background: var(--tb-light);
    border-color: var(--tb-border);
    color: var(--tb-black);
}

.list-group-item {
    border-color: var(--tb-border);
}

.list-group-item.active,
.list-group-item.active:hover,
.list-group-item.active:focus {
    background: var(--tb-green);
    border-color: var(--tb-green);
}

/* ==========================================================================
   BOTÕES
   ========================================================================== */

.btn {
    border-radius: 5px;
    transition: all .18s ease;
}

.btn-primary {
    background: var(--tb-green);
    border-color: var(--tb-green);
    color: #fff;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active {
    background: var(--tb-green-dark);
    border-color: var(--tb-green-dark);
    color: #fff;
}

.btn-default {
    background: #fff;
    border-color: #dcdcdc;
    color: var(--tb-text);
}

.btn-default:hover {
    border-color: var(--tb-green);
    color: var(--tb-green-dark);
    background: #fff;
}

/* ==========================================================================
   PRODUTOS
   ========================================================================== */

.product-layout {
    margin-bottom: 24px;
}

.product-layout .product-thumb {
    height: 100%;
    background: #fff;
    border: 1px solid var(--tb-border);
    border-radius: 8px;
    overflow: hidden;
    padding: 0;
    transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

.product-layout .product-thumb:hover {
    transform: translateY(-2px);
    border-color: #cfead5;
    box-shadow: 0 10px 26px rgba(0,0,0,.08);
}

.product-thumb .image {
    background: #fff;
    padding: 16px;
    text-align: center;
}

.product-thumb .image img {
    margin: 0 auto;
}

.product-thumb .caption {
    padding: 14px 16px 8px;
    min-height: 145px;
}

.product-thumb h4 {
    margin-top: 0;
    min-height: 38px;
}

.product-thumb h4 a {
    color: var(--tb-black);
    font-size: 14px;
    font-weight: 600;
}

.product-thumb h4 a:hover {
    color: var(--tb-green-dark);
}

.product-thumb .description {
    color: var(--tb-muted);
}

.price {
    color: var(--tb-green-dark);
    font-weight: 700;
    font-size: 18px;
}

.price-new {
    color: var(--tb-green-dark);
    font-weight: 700;
}

.price-old {
    color: #999;
    text-decoration: line-through;
    font-size: 13px;
}

.product-thumb .button-group {
    border-top: 1px solid var(--tb-border);
    background: #fff;
    overflow: hidden;
}

.product-thumb .button-group button {
    background: #fff;
    color: var(--tb-black);
    border: 0;
    border-right: 1px solid var(--tb-border);
    min-height: 42px;
    font-weight: 600;
}

.product-thumb .button-group button:first-child {
    background: var(--tb-green);
    color: #fff;
}

.product-thumb .button-group button:hover {
    background: var(--tb-black);
    color: #fff;
}

/* ==========================================================================
   FORMULÁRIOS
   ========================================================================== */

.form-control {
    border-color: #dcdcdc;
    box-shadow: none;
    border-radius: 5px;
}

.form-control:focus {
    border-color: var(--tb-green);
    box-shadow: 0 0 0 2px rgba(24,200,62,.08);
}

/* ==========================================================================
   TABELAS / CHECKOUT / CARRINHO
   ========================================================================== */

.table > thead > tr > td,
.table > thead > tr > th {
    background: var(--tb-light);
    color: var(--tb-black);
    border-bottom: 2px solid var(--tb-green);
}

.table-bordered {
    border-color: var(--tb-border);
}

.table-bordered > tbody > tr > td,
.table-bordered > tbody > tr > th,
.table-bordered > tfoot > tr > td,
.table-bordered > tfoot > tr > th,
.table-bordered > thead > tr > td,
.table-bordered > thead > tr > th {
    border-color: var(--tb-border);
}

/* ==========================================================================
   RODAPÉ
   ========================================================================== */

#tb-footer {
    background: var(--tb-black);
    color: #bdbdbd;
    padding: 40px 0 18px;
    margin-top: 46px;
    font-size: 12px;
    border-top: 4px solid var(--tb-green);
}

#tb-footer h5 {
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    margin-bottom: 14px;
}

#tb-footer h5:after {
    content: "";
    display: block;
    width: 32px;
    height: 2px;
    background: var(--tb-green);
    margin-top: 8px;
}

#tb-footer a {
    color: #bdbdbd;
}

#tb-footer a:hover {
    color: var(--tb-green);
}

#tb-footer hr {
    border-color: #2b2b2b;
    margin: 24px 0 14px;
}

.tb-footer-bottom {
    text-align: center;
    font-size: 11px;
    color: #858585;
}

/* ==========================================================================
   RESPONSIVO
   ========================================================================== */

@media (max-width: 991px) {
    .tb-header-inner {
        flex-wrap: wrap;
        gap: 14px;
    }

    .tb-logo {
        width: calc(50% - 7px);
    }

    .tb-header-actions {
        width: calc(50% - 7px);
        justify-content: flex-end;
    }

    #search,
    .tb-search {
        order: 3;
        width: 100%;
        max-width: none;
        flex-basis: 100%;
    }

    .tb-nav-list {
        display: block;
    }

    .tb-nav-list > li {
        display: block;
    }

    .tb-nav-list > li > a {
        padding: 12px 14px;
        border-top: 1px solid #242424;
    }

    .tb-mega-menu {
        position: static;
        float: none;
        min-width: 0;
        width: 100%;
        box-shadow: none;
        border-top: 2px solid var(--tb-green);
    }
}

@media (max-width: 767px) {
    #tb-topbar {
        font-size: 11px;
    }

    .tb-topbar-inner {
        min-height: 32px;
    }

    .tb-topbar-right .list-inline > li {
        margin-left: 8px;
    }

    .tb-header-inner {
        padding: 14px 0;
        min-height: auto;
    }

    .tb-logo {
        width: 48%;
    }

    #logo img {
        max-width: 160px;
        max-height: 52px;
    }

    .tb-header-actions {
        width: 48%;
        gap: 10px;
    }

    .tb-account-action span {
        display: none !important;
    }

    #cart > button,
    #cart > .btn {
        padding: 8px 10px;
        font-size: 12px;
    }

    #search .form-control,
    .tb-search .form-control {
        height: 44px;
        font-size: 12px;
    }

    #tb-button-search {
        height: 44px;
        min-width: 50px;
        padding: 0 14px;
    }

    #tb-button-search span {
        display: none !important;
    }

    .product-thumb .caption {
        min-height: auto;
    }
}

@media (max-width: 479px) {
    .tb-logo {
        width: 42%;
    }

    .tb-header-actions {
        width: 54%;
    }

    #logo img {
        max-width: 135px;
    }

    #cart .dropdown-menu {
        min-width: 285px;
        right: -10px;
    }
}
/* CABEÇALHO TRINDADE - ESTILO CHROMIUM PRO */
#tb-topbar{background:#1B1C18;color:#c6c8bd;border:0}
#tb-topbar .tb-topbar-inner{min-height:34px;padding:7px 0}
#tb-topbar a{color:#d7d9cf}
#tb-topbar a:hover{color:#0FCB3E}
#tb-topbar .fa{color:#0FCB3E}

#tb-header{background:#fff;border-bottom:0;box-shadow:0 1px 3px rgba(20,20,10,.06)}
.tb-main-header{background:#fff}
.tb-header-inner{min-height:86px;padding:16px 0;gap:26px}
.tb-logo{flex:0 0 auto}
.tb-logo img{max-height:58px;max-width:180px}

.tb-search{flex:1 1 auto;max-width:none}
.tb-search #search{width:100%;max-width:none;margin:0}
.tb-search #search .form-control{height:46px;border:1.5px solid #1B1C18;border-right:0;border-radius:6px 0 0 6px;box-shadow:none;font-size:14px}
.tb-search #search .btn{height:46px;min-width:58px;background:#1B1C18;border:1.5px solid #1B1C18;color:#fff;border-radius:0 6px 6px 0}
.tb-search #search .btn:hover{background:#0A6B27;border-color:#0A6B27}

.tb-header-actions{display:flex;align-items:center;gap:18px}
.tb-icon-action{min-width:52px;text-align:center;color:#767A6D;font-size:11px;display:flex;flex-direction:column;align-items:center;gap:3px;position:relative}
.tb-icon-action i{color:#1B1C18;font-size:21px;margin:0}
.tb-icon-action:hover,.tb-icon-action:hover i{color:#0A6B27}
.tb-icon-action small{position:absolute;top:-7px;right:2px;min-width:17px;height:17px;line-height:17px;border-radius:50%;background:#0FCB3E;color:#1B1C18;font-weight:700;font-size:9px}

.tb-cart-wrap #cart{margin:0}
.tb-cart-wrap #cart > button,.tb-cart-wrap #cart .btn{height:46px;background:#1B1C18;border-color:#1B1C18;color:#fff;border-radius:6px;font-weight:700}
.tb-cart-wrap #cart > button:hover,.tb-cart-wrap #cart .btn:hover{background:#0A6B27;border-color:#0A6B27}

.tb-helper-strip{background:#F6F7F2;border-top:1px solid #E5E6DF;border-bottom:1px solid #E5E6DF}
.tb-helper-inner{display:flex;justify-content:center;align-items:center;gap:16px;min-height:40px;font-size:12.5px;color:#2C2D25}
.tb-helper-inner i{color:#0A6B27}
.tb-helper-inner a{background:#0A6B27;color:#fff;padding:7px 14px;border-radius:5px;font-weight:700}
.tb-helper-inner a:hover{background:#063E17;color:#fff}

#tb-nav{background:#1B1C18;border:0}
#tb-nav .navbar{margin:0;min-height:0;border:0;background:transparent}
#tb-nav .navbar-nav>li>a{color:#dcded3;font-size:13px;font-weight:500;padding:14px 18px}
#tb-nav .navbar-nav>li>a:hover,#tb-nav .navbar-nav>li.open>a{background:rgba(255,255,255,.04);color:#0FCB3E}
#tb-nav .dropdown-menu{border:0;border-top:3px solid #0FCB3E;border-radius:0 0 6px 6px;box-shadow:0 8px 24px rgba(20,20,10,.10)}

@media(max-width:991px){
  .tb-header-inner{flex-wrap:wrap;gap:12px}
  .tb-logo img{max-height:48px}
  .tb-search{order:3;flex-basis:100%}
  .tb-header-actions{margin-left:auto}
  .tb-helper-inner{justify-content:space-between;padding:7px 0}
}
@media(max-width:767px){
  #tb-topbar .tb-topbar-note{display:none!important}
  .tb-header-inner{min-height:auto;padding:12px 0}
  .tb-logo img{max-width:120px;max-height:42px}
  .tb-header-actions{gap:10px}
  .tb-helper-inner{flex-direction:column;gap:6px;padding:8px 0;text-align:center}
}
/* MENU PRINCIPAL TRINDADE - ESTILO CHROMIUM PRO */
#tb-nav{background:#1B1C18!important;border:0!important;box-shadow:0 2px 8px rgba(0,0,0,.08)}
#tb-nav #menu{background:transparent!important;border:0!important;border-radius:0!important;min-height:48px;margin:0!important}
#tb-nav #menu .navbar-header,#tb-nav #menu .navbar-collapse{background:transparent!important}
#tb-nav #menu .navbar-nav{float:none!important;display:flex!important;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;margin:0!important;width:100%}
#tb-nav #menu .navbar-nav>li{float:none!important;display:block;position:relative}
#tb-nav #menu .navbar-nav>li>a{display:flex;align-items:center;min-height:48px;padding:0 20px!important;color:#F2F3EE!important;background:transparent!important;font-size:12.5px;font-weight:700;letter-spacing:.01em;white-space:nowrap;border-right:1px solid rgba(255,255,255,.07);transition:.18s}
#tb-nav #menu .navbar-nav>li>a:hover,#tb-nav #menu .navbar-nav>li>a:focus,#tb-nav #menu .navbar-nav>li.open>a{color:#0FCB3E!important;background:#24251F!important}
#tb-nav #menu .navbar-nav>li>a:after{content:"";position:absolute;left:20px;right:20px;bottom:0;height:3px;background:#0FCB3E;transform:scaleX(0);transition:transform .18s ease}
#tb-nav #menu .navbar-nav>li:hover>a:after,#tb-nav #menu .navbar-nav>li.open>a:after{transform:scaleX(1)}
#tb-nav #menu .dropdown-menu{margin:0!important;padding:16px!important;min-width:250px;background:#fff!important;border:0!important;border-top:3px solid #0FCB3E!important;border-radius:0 0 7px 7px!important;box-shadow:0 12px 30px rgba(0,0,0,.16)!important}
#tb-nav #menu .dropdown-inner{display:flex;gap:24px}
#tb-nav #menu .dropdown-inner ul{min-width:190px;margin:0;padding:0;list-style:none}
#tb-nav #menu .dropdown-inner li a,#tb-nav #menu .dropdown-menu>li>a{display:block;padding:8px 10px!important;color:#2C2D25!important;background:#fff!important;font-size:12.5px;font-weight:500;border-radius:4px;white-space:normal}
#tb-nav #menu .dropdown-inner li a:hover,#tb-nav #menu .dropdown-menu>li>a:hover{color:#0A6B27!important;background:#EFFBF2!important;padding-left:14px!important}
#tb-nav #menu .see-all{display:block;margin-top:10px;padding:10px 12px!important;color:#0A6B27!important;font-weight:700!important;border-top:1px solid #E5E6DF}
@media(min-width:992px){#tb-nav .container{max-width:1200px;padding-left:0;padding-right:0}#tb-nav #menu .navbar-nav>li>a{padding-left:18px!important;padding-right:18px!important}}
@media(max-width:991px){#tb-nav #menu .navbar-nav{display:block!important;width:100%}#tb-nav #menu .navbar-nav>li>a{min-height:44px;padding:0 16px!important;border-right:0;border-top:1px solid rgba(255,255,255,.07)}#tb-nav #menu .dropdown-menu{position:static!important;float:none!important;width:100%!important;min-width:0;box-shadow:none!important;border-radius:0!important}#tb-nav #menu .dropdown-inner{display:block}}
