/* product_info.css - Product info page styles */
.product-info .popup-gallery.col-sm-7 {
    width: calc(100% - 672px);
    padding-right: 24px;
}

.product-info .product-center.col-sm-5 {
    width: 672px !important;
}

.product-info .product-center>div {
    width: 100%;
}

.product-info .options2>div .select,
.product-info .options2 select {
    width: 254px;
}

#product1 .create-design-btn .btn-upload-artwork {
    padding: 0 16px;
}

#product1 .create-design-btn .btn-upload-artwork .add-diy-btn-icon2 {
    margin-left: 8px;
    width: 24px;
    height: 24px;
}

/* @ai L2 | @prompt: Move the product downloads section and title presentation out of product-info inline styles | @date: 2026-09-03 */
.product-info .product-downloads {
    padding-top: 20px;
    /* margin-top: 20px;
    border-top: 1px solid #E8EBF0; */
}

.product-info .product-downloads .template-title {
    margin: 0 0 12px;
    color: #141737;
    font-size: 16px;
    font-weight: 700;
    line-height: 24px;
}

/* @ai L2 | @prompt: Centralize product information presentation styles previously embedded in template markup | @date: 2026-09-03 */
#product-info .product-heading-title {
    font-size: 26px;
}

#product-info .option-image-option.has-option-image {
    background-image: var(--option-image);
}

#product-info .option-value-with-image {
    padding: 2px;
}

#product-info .option-value-image {
    border-radius: 10px;
}

#product-info .option-none-discount-price {
    text-decoration: line-through;
}

#product-info .option-help-icon {
    color: #009a9e;
    font-size: 14px;
}

#product-info .option-date-input {
    cursor: pointer;
}

#product-info .option-date-trigger {
    height: 32px;
}

#product-package .package-price-initially-hidden,
#product-package .create-design-unavailable,
#product-package .talk-to-expert-hidden,
#product-package .sld-shipping-time-hidden,
#product-package .option-child-initially-hidden {
    display: none;
}

#product-package .package-price-main-column {
    padding-left: 0;
}

#product-package .credit-map-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(70px, 1fr));
    gap: 2px;
}

#product-package .credit-map-item {
    text-align: center;
}

#product-package .credit-map-image {
    display: block;
    max-width: 100%;
    height: auto;
    margin: 0 auto;
}

#product-package .credit-map-name {
    display: block;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.3;
    word-wrap: break-word;
}

#product-package .option-package-link-single,
#product-package .option-package-link-two {
    text-align: left;
}

#product-package .option-package-link-two {
    padding-left: 8px;
}

#product-package .graphic-only.option-package-link {
    display: flex;
    align-items: center;
    gap: 8px;
}

#product-package .graphic-only.option-package-link-single,
#product-package .graphic-only.option-package-link-two {
    justify-content: flex-start;
}

#product-package .graphic-only.option-package-link-three {
    justify-content: center;
}

#product-package .graphic-only .package-video-button {
    display: flex !important;
    flex: 0 0 auto;
    padding-left: 0 !important;
}

#product-package .nav-tabs > li > .option-package-link {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    white-space: nowrap;
}

#product-package .nav-tabs-3 > li:nth-child(2) {
    justify-content: center;
}

#product-package .nav-tabs > li:nth-child(2) > .option-package-link,
#product-package .nav-tabs > li:last-child > .option-package-link {
    padding-left: 0;
    padding-right: 0;
    text-align: left;
}

#product-package .option-radio-row {
    margin: 0;
    padding: 0;
}

#product-package .option-clear-left {
    clear: left;
}

#product-package .option-color-mat-hidden {
    display: none;
}

#product-package .option-note-message {
    color: #b94a48;
    font-size: 14px;
}

#product-package .custom-size-primary {
    width: 50%;
    margin-right: 5px;
}

#product-package .custom-size-secondary {
    width: 50%;
}

#product-package .artwork-upload-full-width,
#product-package .option-child-full-width-label {
    width: 100%;
}

#product-package .option-child-radio {
    width: auto;
    margin: auto 5px 5px 0;
}

#product-package .delivery-option-title {
    display: inline-block;
    line-height: 30px;
}

#product-package .delivery-free-shipping {
    line-height: 24px;
}

#product-package .delivery-video-button-inline {
    vertical-align: middle;
    font-size: 0;
}

#product-package .delivery-options {
    padding-top: 0;
    background: transparent;
}

#product-package .shipping-zipcode-input {
    height: 37px;
}

/* @ai L2 | @prompt: Move setup-instructions presentation rules out of template inline styles | @date: 2026-09-03 */
#product-info .instructions-download-link {
    display: inline-block;
    text-decoration: none;
    cursor: default;
    margin-bottom: 8px;
    padding-top: 20px;
    width: 100%;
    border-top: 1px solid #E8EBF0;
}

#product-info .instructions-download-button {
    height: 24px;
    margin: 0;
    display: flex;
    align-items: center;
    cursor: default;
}

#product-info .instructions-download-button .all-download,
#product-info .instructions-download-button .all-download * {
    cursor: pointer;
}

#product-info .instructions-pdf-list {
    text-align: left;
}

/* @ai L2 | @prompt: Move setup-instructions component styles from its Twig template into the product stylesheet | @date: 2026-09-03 */
#product-info .design-templates:last-child {
    padding-bottom: 0;
}

#product-info .instructions-video .title {
    display: flex;
    align-items: center;
    margin-top: 20px;
    margin-bottom: 0;
}

#product-info .instructions-pdf-list {
    color: #666c7c;
    cursor: pointer;
    font-size: 14px;
    line-height: 22px;
}

#product-info .instructions-pdf-list:hover {
    color: #009a9e;
}

#product-info .instructions-video .video-js,
#product-info .instructions-video .video-youtube {
    margin-top: 22px;
}

#product-info .instructions-video .video-js {
    display: block;
    width: 100%;
    max-width: 100%;
    height: 349px;
    box-sizing: border-box;
    border-radius: 4px;
    margin: 0;
    margin-top: 8px;
}
#product1 .return-policy {
    margin-top: 16px;
}
#product-info .instructions-video .vjs-tech {
    border: 1px solid #e8ebf0;
    border-radius: 4px;
    object-fit: contain;
}

#product-info .instructions-video .title svg {
    display: block;
    cursor: pointer;
    line-height: 20px;
}

#product-info .instructions-video h3 {
    margin: 0;
    padding: 0;
    color: #141737;
    font-size: 14px;
    font-weight: bold;
    line-height: 22px;
    cursor: pointer;
}

#product-info .instructions-video h3:hover {
    color: #009a9e;
}

#product-info #instructionsVideoLink {
    border: 0;
    outline: 0;
    border-radius: 4px;
}

/* @ai L2 | @prompt: Move newly added setup-instructions dimensions and spacing out of Twig inline styles | @date: 2026-09-03 */
#product-info .instructions-pdf-list,
#product-info .instructions-pdf-name {
    width: 28px;
}

#product-info .instructions-video .instructions-guide-icon {
    width: 28px;
    margin: 0;
    margin-right: 8px;
}

#product-info .instructions-video h3.instructions-guide-title {
    margin-right: 8px;
}

/* @ai L2 | @prompt: Move design-template and artwork-video component styles from Twig into the product stylesheet | @date: 2026-09-03 */
#product-info .design-template-wrap {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

#product-info .design-template-wrap .design-templates span {
    padding-right: 0;
    padding-left: 0;
}

#product-info .design-template-wrap .template-pdf,
#product-info .design-template-wrap .template-png {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

#product-info .design-template-wrap .template-pdf .title,
#product-info .design-template-wrap .template-png .title {
    display: flex;
    align-items: center;
}

#product-info .design-template-wrap .template-pdf .title img,
#product-info .design-template-wrap .template-png .title img {
    margin-right: 8px;
}

/* PDF files without PNG templates use the full available width. */
#product-info .design-template-wrap .template-pdf.artwork-images-empty {
    width: 100%;
    border-right: 0;
}

#product-info .template-pdf.artwork-images-empty .file-name > span:first-child {
    padding-right: 0;
}

#product-info .design-template-wrap .template-pdf.artwork-images-empty .file-link {
    max-width: 645px;
    /* padding-left: 8px; */
    cursor: pointer;
}

#product-info .template-icon,
#product-info .photoshop-icon {
    width: 28px;
    height: 28px;
}

#product-info .design-template-wrap .sld-artwork-tool-btn {
    display: flex;
    align-items: center;
    width: auto;
    height: auto;
    margin: 0;
    font-size: 14px;
    line-height: 1;
    cursor: default;
}

#product-info .design-template-wrap .sld-artwork-tool-btn .all-download,
#product-info .design-template-wrap .sld-artwork-tool-btn .all-download-png {
    display: inline-flex;
    align-items: center;
    line-height: 1;
}

#product-info .design-template-wrap .sld-artwork-tool-btn .all-download svg,
#product-info .design-template-wrap .sld-artwork-tool-btn .all-download-png svg {
    display: block;
}

/* PNG files without PDF templates use the full available width. */
#product-info .design-template-wrap .template-png.template-png-empty {
    width: 100%;
    padding-left: 0;
}

#product-info .design-template-wrap .template-png.template-png-empty .file-link {
    max-width: 645px;
    padding: 0;
    cursor: pointer;
}

#product-info .template-png.template-png-empty .file-name > span {
    padding-left: 0;
}

#product-info .design-template-wrap .file-name {
    display: flex;
    width: 100%;
    align-items: flex-start;
    color: #666c7c;
}

#product-info .design-template-wrap .file-name span:first-child {
    display: inline-block;
    flex: 0 0 auto;
    margin-right: 8px;
    margin-top: 4px;
}

#product-info .design-template-wrap .file-name:hover span:not(:first-child) {
    color: #009a9e !important;
}

#product-info .design-template-wrap .file-name:hover .file-link {
    color: #009a9e !important;
}

#product-info .design-template-wrap .file-name svg {
    display: block;
    width: 28px;
    line-height: 22px;
}

#product-info .design-template-wrap .design-templates {
    padding: 0;
}

#product-info .design-template-wrap .file-link {
    display: block;
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    color: #666c7c;
    font-size: 14px;
    line-height: 22px;
    overflow-wrap: break-word;
    word-break: break-word;
    cursor: pointer;
    margin: 0;
}

#product-info .template-video {
    margin-top: 20px;
}

#product-info .template-video .title {
    display: flex;
    align-items: center;
}

#product-info .template-video .title img {
    width: 28px;
    margin: 0 8px 0 0;
}

#product-info .template-video .title svg {
    display: block;
    line-height: 24px;
    cursor: pointer;
}

#product-info .template-video h3 {
    margin: 0 8px 0 0;
    padding: 0;
    color: #141737;
    font-size: 14px;
    font-weight: bold;
    line-height: 22px;
    cursor: pointer;
}

#product-info .template-video h3:hover {
    color: #009a9e;
}

#product-info .template-video .video-js {
    width: 100%;
    height: 349px;
    margin-top: 8px;
    margin-bottom: 20px;
}

#product-info .template-video .video-js video {
    border: 1px solid #e8ebf0;
    border-radius: 4px;
    object-fit: contain;
}

#product-info #artworkVideoLink {
    border: 0;
    outline: 0;
    border-radius: 4px;
}