/*!* Style the buttons that are used to open and close the accordion panel *!*/
/*.accordion {*/
/*    background-color: #eee;*/
/*    color: #444;*/
/*    cursor: pointer;*/
/*    padding: 18px;*/
/*    width: 100%;*/
/*    text-align: left;*/
/*    border: none;*/
/*    outline: none;*/
/*    transition: 0.4s;*/
/*    display: block;*/
/*}*/

/*!* Add a background color to the button if it is clicked on (add the .active class with JS), and when you move the mouse over it (hover) *!*/
/*.active, .accordion:hover {*/
/*    background-color: #ccc;*/
/*}*/

/*!* Style the accordion panel. Note: hidden by default *!*/
/*.panel {*/
/*    padding: 0 18px;*/
/*    background-color: white;*/
/*    display: none;*/
/*    overflow: hidden;*/
/*}*/

/*.box h3 {*/
/*    margin: 10px 0 5px 0;*/
/*}*/


/*.mobile .box {*/
/*    padding: 5px;*/
/*}*/

/*.mobile .panel {*/
/*    padding: 0;*/
/*}*/

/*.hidden {*/
/*    display: none;*/
/*}*/

/* ------------------------------- */

.msg {
    border: 1px solid;
    margin: 10px 0px;
    display: block;

    font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif;

    padding: 8px 35px 8px 14px;
    margin-bottom: 18px;
    text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
    border: 1px solid #eed3d7;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;

}

.msg-big {
    padding: 10px;
    font-size: 18px;
}

.msg-warning {
    color: #a16207;
    background-color: #fefce8;
    /*text-shadow: none;*/
    /*font-weight: bolder;*/
}

.msg-error {
    color: #b91c1c;
    background-color: #fef2f2;
    /*text-shadow: none;*/
    /*font-weight: bolder;*/
}

.msg-info {
    background-color: #d7ecfa;
    color: #0a0a0a;
}

/* ------------------------------- */

.long-desc {
    font-size: 13px;
    line-height: normal;
}

.variant-label-in-error {
    font-weight: bold;
}

.payment-method select {
    display: flex;
    padding: 10px;
    margin: 10px 0;
    font-size: 16px;
    border: 1px solid #ccc;
    border-radius: 5px;
}

textarea {
    max-height: 9rem;
    flex: 1 1 0%;
    border-radius: 0.375rem;
    border-width: 0px;
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity));
    padding-top: 0.75rem;
    padding-bottom: 0.75rem;
    padding-left: 0.75rem;
    padding-right: 0.75rem;
    font-family: Roboto, sans-serif;
    --tw-text-opacity: 1;
    color: rgb(17 24 39 / var(--tw-text-opacity));
    outline: 2px solid transparent;
    outline-offset: 2px;
    --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
    --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
    box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
    --tw-ring-inset: inset;
    --tw-ring-opacity: 1;
    --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity));
}

/* ------------------------------- */

.btn.info, .btn-info {
    --tw-bg-opacity: 1;
    background-color: rgb(46 94 171 / var(--tw-bg-opacity));
    --tw-text-opacity: 1;
    color: rgb(255 255 255 / var(--tw-text-opacity));
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;
}

.btn.info:hover, .btn-info:hover {
    --tw-bg-opacity: 1;
    background-color: rgb(86 140 227);
}

button.warning, .btn.warning, .btn-warning {
    background-color: #ff0c0082;
    color: white;
    --tw-bg-opacity: 1;
    --tw-text-opacity: 1;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 150ms;

}

button.warning:hover, .btn.warning:hover, .btn-warning:hover {
    background-color: #ff0c00;

}

/* ------------------------------- */

.add-to-cart-button {
    text-align: right;
    margin: 10px 0;
}

/* ------------------------------- */

.order-form-contact label {
    display: block;
    text-align: left;
}

.order-form-contact tbody th {
    width: 25%;
}

.order-form-contact tbody td {
    width: 75%;
    /*background-color: red;*/
}

.order-form-contact tbody td input {
    width: 60%;
    margin: 0.25rem;
}


.profile-edit-form table {
    width: 100%;
}

.profile-edit-form h3 {
    margin: 0.9rem 0;
}

.profile-edit-form .save {
    text-align: right;
}

/* ------------------------------- */

.shop-item .amount-field input {
    width: 6rem;
}

/* ------------------------------- */

.table {
    max-width: 100%;
    border-collapse: collapse;
    border-spacing: 0;
    background-color: transparent;
    width: 100%;
    margin-bottom: 18px;
}

.table th,
.table td {
    padding: 8px;
    /*line-height: 18px;*/
    text-align: left;
    vertical-align: top;
    border-top: 1px solid #dddddd;
}

.table th {
    font-weight: bold;
}

.table thead th {
    vertical-align: bottom;
}

.table colgroup + thead tr:first-child th,
.table colgroup + thead tr:first-child td,
.table thead:first-child tr:first-child th,
.table thead:first-child tr:first-child td {
    border-top: 0;
}

.table tbody + tbody {
    border-top: 2px solid #dddddd;
}

.table-condensed th,
.table-condensed td {
    padding: 4px 5px;
}

.table-bordered {
    border: 1px solid #dddddd;
    border-left: 0;
    border-collapse: separate;
    *border-collapse: collapsed;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

.table-bordered th,
.table-bordered td {
    border-left: 1px solid #dddddd;
}

.table-bordered thead:first-child tr:first-child th,
.table-bordered tbody:first-child tr:first-child th,
.table-bordered tbody:first-child tr:first-child td {
    border-top: 0;
}

.table-bordered thead:first-child tr:first-child th:first-child,
.table-bordered tbody:first-child tr:first-child td:first-child {
    -webkit-border-radius: 4px 0 0 0;
    -moz-border-radius: 4px 0 0 0;
    border-radius: 4px 0 0 0;
}

.table-bordered thead:first-child tr:first-child th:last-child,
.table-bordered tbody:first-child tr:first-child td:last-child {
    -webkit-border-radius: 0 4px 0 0;
    -moz-border-radius: 0 4px 0 0;
    border-radius: 0 4px 0 0;
}

.table-bordered thead:last-child tr:last-child th:first-child,
.table-bordered tbody:last-child tr:last-child td:first-child {
    -webkit-border-radius: 0 0 0 4px;
    -moz-border-radius: 0 0 0 4px;
    border-radius: 0 0 0 4px;
}

.table-bordered thead:last-child tr:last-child th:last-child,
.table-bordered tbody:last-child tr:last-child td:last-child {
    -webkit-border-radius: 0 0 4px 0;
    -moz-border-radius: 0 0 4px 0;
    border-radius: 0 0 4px 0;
}

.table-striped tbody tr:nth-child(odd) td,
.table-striped tbody tr:nth-child(odd) th {
    background-color: #f9f9f9;
}

.table tbody tr:hover td,
.table tbody tr:hover th {
    background-color: #f5f5f5;
}

/* --------------------------------------------- */

.account-content {
    width: 100%;
}

.account-content h1 {
    font-size: 2.25rem;
    line-height: 2.5rem;
}

.account-content h2 {
    font-size: 1.875rem;
    line-height: 2.25rem;
}

.account-content h3 {
    font-size: 1.5rem;
    line-height: 2rem;
}


/* ------------------------------- */

.form-errors .label {
    color: #b91c1c;
    font-weight: bold;
}


.index-image {
    height: 18rem;
}

.accordion-item-title {
    font-size: 1.35rem;
}

.shop-item {
    background-color: #fdfdfd;
}