/* Studio skin: compact product form. Scoped so classic stays unchanged. */

.fmw-skin-studio {
    --fmw-studio-ink: var(--porto-heading-color, #222529);
    --fmw-studio-muted: var(--porto-body-color, #777);
    --fmw-studio-line: var(--porto-gray-2, #e7e7e7);
    --fmw-studio-paper: var(--porto-light-100, #f4f4f4);
    --fmw-studio-fill: var(--porto-heading-color, #222529);
    color: inherit;
    font-family: var(--porto-body-ff, inherit);
    width: 100%;
    margin: 0 0 1rem;
    padding: 0 0 1.25rem;
    border-bottom: 1px solid var(--fmw-studio-line);
}

.fmw-skin-studio .fmw-option-groups {
    margin: 0 0 20px;
}

.fmw-skin-studio .fmw-option-group {
    margin-bottom: 14px;
}

.fmw-skin-studio .fmw-option-group-label,
.fmw-skin-studio .fmw-fabric-selector-label {
    font-weight: 500;
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-bottom: 8px;
    color: var(--fmw-studio-muted);
}

.fmw-skin-studio .fmw-option-select {
    max-width: 100%;
    border: none;
    border-bottom: 1px solid var(--fmw-studio-line);
    border-radius: 0;
    background: transparent;
    padding: 6px 0;
}

.fmw-skin-studio .fmw-option-radio {
    border: 1px solid var(--fmw-studio-line);
    border-radius: 999px;
    background: transparent;
    padding: 4px 12px;
}

.fmw-skin-studio .fmw-option-radio input[type="radio"]:checked + .fmw-option-label {
    font-weight: 500;
}

.fmw-skin-studio .fmw-option-swatch {
    width: auto;
    height: auto;
    min-width: 0;
    min-height: 0;
    max-width: none;
    max-height: none;
    flex-direction: row;
    gap: 8px;
    align-items: center;
}

.fmw-skin-studio .fmw-option-groups .fmw-swatch-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px 12px;
    align-items: flex-start;
    justify-content: flex-start;
    padding: 0;
}

.fmw-skin-studio .fmw-option-groups .fmw-option-swatch.fmw-image-swatch {
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    width: 56px;
    min-width: 56px;
    max-width: 56px;
    height: auto;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch .fmw-swatch-image,
.fmw-skin-studio .fmw-option-groups .fmw-image-swatch .fmw-swatch-image img {
    width: 56px;
    height: 56px;
    min-width: 56px;
    min-height: 56px;
    border-radius: 4px;
    object-fit: cover;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch .fmw-swatch-image {
    border: 2px solid transparent;
    box-shadow: none;
    overflow: hidden;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch:hover .fmw-swatch-image {
    border-color: var(--fmw-studio-line);
    box-shadow: none;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch input[type="radio"]:checked + .fmw-swatch-image {
    border: 2px solid var(--fmw-studio-ink);
    box-shadow: none;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch .fmw-swatch-label {
    margin-top: 0;
    width: 100%;
    font-size: 13px;
    color: var(--fmw-studio-muted);
    text-align: center;
}

.fmw-skin-studio .fmw-option-groups .fmw-image-swatch input[type="radio"]:checked ~ .fmw-swatch-label {
    color: var(--fmw-studio-ink);
}

.fmw-skin-studio .fmw-swatch-color {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid var(--fmw-studio-line);
}

.fmw-skin-studio .fmw-fabric-options-box {
    margin: 0;
    padding: 0;
    background: none;
    border: none;
    box-shadow: none;
}

.fmw-skin-studio .fmw-fabric-swatches-row {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    gap: 10px 12px;
    align-items: flex-start;
    justify-content: flex-start;
}

.fmw-skin-studio .fmw-fabric-swatch-cell {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    width: auto;
    min-width: 88px;
    max-width: 140px;
    padding: 0;
    margin: 0;
    border: none;
}

.fmw-skin-studio .fmw-fabric-swatch,
.fmw-skin-studio .fmw-fabric-swatch.selected {
    width: 56px;
    height: 56px;
    min-width: 56px;
    min-height: 56px;
    max-width: 56px;
    max-height: 56px;
    flex-direction: column;
    background: transparent;
    border: none;
    box-shadow: none;
    outline: none;
}

.fmw-skin-studio .fmw-fabric-swatch-image,
.fmw-skin-studio .fmw-fabric-swatch-image img,
.fmw-skin-studio .fmw-show-all-fabrics .fmw-fabric-swatch-image {
    width: 56px !important;
    height: 56px !important;
    min-width: 56px;
    min-height: 56px;
    border-radius: 4px;
    object-fit: cover;
}

.fmw-skin-studio .fmw-fabric-swatch .fmw-fabric-swatch-image {
    border: 2px solid transparent;
    box-shadow: none;
    overflow: hidden;
}

.fmw-skin-studio .fmw-fabric-swatch.selected .fmw-fabric-swatch-image,
.fmw-skin-studio .fmw-fabric-swatch:hover .fmw-fabric-swatch-image {
    outline: none;
    border: 2px solid var(--fmw-studio-ink);
    box-shadow: none;
}

.fmw-skin-studio .fmw-fabric-swatch-cell:has(.fmw-show-all-fabrics) {
    display: none;
}

.fmw-skin-studio .fmw-fabric-swatch-cell:has(.fmw-fabric-swatch.selected) {
    box-shadow: none;
}

.fmw-skin-studio .fmw-fabric-swatch-info {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    margin: 0;
    width: 100%;
}

.fmw-skin-studio .fmw-fabric-swatch-name {
    display: block;
    font-size: 11px;
    font-weight: 500;
    color: var(--fmw-studio-muted);
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
    word-break: break-word;
    line-height: 1.3;
    width: 100%;
    text-align: center;
}

.fmw-skin-studio .fmw-fabric-swatch-cell:has(.fmw-fabric-swatch.selected) .fmw-fabric-swatch-name {
    color: var(--fmw-studio-ink);
}

.fmw-skin-studio .fmw-fabric-swatch-price {
    font-size: 10px;
    color: var(--fmw-studio-muted);
    font-weight: 400;
    text-align: center;
}

.fmw-skin-studio .fmw-browse-fabrics {
    display: inline;
    margin: 10px 0 0;
    padding: 0;
    background: none;
    border: none;
    border-radius: 0;
    color: var(--fmw-studio-ink);
    font-size: 13px;
    letter-spacing: 0;
    text-decoration: underline;
    text-underline-offset: 2px;
    cursor: pointer;
    box-shadow: none;
}

.fmw-skin-studio .fmw-browse-fabrics:hover {
    background: none;
    color: var(--fmw-studio-ink);
    border: none;
    text-decoration: none;
}

.fmw-skin-studio #fmw-fabric-info-box {
    display: none !important;
}

.fmw-skin-studio #fmw-fabric-summary {
    display: block;
    margin: 12px 0 0;
    padding: 10px 0 0;
    font-size: 13px;
    color: var(--fmw-studio-muted);
    border-top: 1px solid var(--fmw-studio-line);
}

.fmw-skin-studio .fmw-width-selector-wrap label {
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fmw-studio-muted);
}

.fmw-skin-studio #fmw-width-selector {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
}

.fmw-skin-studio .fmw-studio-width-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 8px 0 0;
}

.fmw-skin-studio .fmw-width-chip,
.fmw-skin-studio .fmw-tier-chip {
    appearance: none;
    background: var(--fmw-studio-paper);
    color: var(--fmw-studio-ink);
    border: 1px solid var(--fmw-studio-line);
    border-radius: 2px;
    padding: 8px 12px;
    font-size: 13px;
    cursor: pointer;
}

.fmw-skin-studio .fmw-width-chip.is-active,
.fmw-skin-studio .fmw-tier-chip.is-active {
    background: var(--fmw-studio-fill);
    color: #fafaf9;
    border-color: var(--fmw-studio-fill);
}

.fmw-skin-studio .fmw-tiered-pricing-table-wrap table,
.fmw-skin-studio .fmw-tiered-pricing-table {
    display: none !important;
}

.fmw-skin-studio .fmw-studio-tier-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 8px;
}

.fmw-skin-studio .fmw-price-summary {
    margin: 12px 0 0;
    font-size: 14px;
    color: var(--fmw-studio-ink);
}

.single-product form.cart:has(.fmw-skin-studio) .quantity,
.single-product form.cart:has(.fmw-skin-studio) .single_add_to_cart_button {
    margin-top: 0;
}

.fmw-skin-studio .fmw-price-label {
    color: var(--fmw-studio-muted);
    font-weight: 400;
}

body.fmw-modal-open {
    overflow: hidden;
}

.fmw-modal.fmw-skin-studio {
    background: rgba(0, 0, 0, 0.45) !important;
    align-items: stretch;
    justify-content: flex-end;
    padding: 0 !important;
}

.fmw-modal.fmw-skin-studio[style*="display: block"],
.fmw-modal.fmw-skin-studio.show {
    display: flex !important;
}

.fmw-modal.fmw-skin-studio .fmw-modal-content {
    position: fixed !important;
    top: 0 !important;
    right: 0 !important;
    left: auto !important;
    height: 100vh !important;
    max-height: 100vh !important;
    width: 42rem !important;
    max-width: 100vw !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #fff !important;
    border-radius: 0 !important;
    box-shadow: -8px 0 32px rgba(0, 0, 0, 0.18) !important;
    transform: translateX(100%);
    opacity: 1 !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column;
    transition: transform 0.28s ease;
}

.fmw-modal.fmw-skin-studio.show .fmw-modal-content {
    transform: translateX(0);
}

.fmw-modal.fmw-skin-studio .fmw-modal-header {
    position: sticky;
    top: 0;
    flex: 0 0 auto;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin: 0;
    padding: 24px 28px 8px;
    background: #fff;
    border-bottom: none;
    z-index: 2;
}

.fmw-modal.fmw-skin-studio .fmw-modal-header-text {
    min-width: 0;
}

.fmw-modal.fmw-skin-studio .fmw-modal-header h3,
.fmw-modal.fmw-skin-studio #fmw-modal-title {
    margin: 0;
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-type-count {
    margin: 4px 0 0;
    font-size: 12px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--fmw-studio-muted);
}

.fmw-modal.fmw-skin-studio .fmw-modal-close {
    position: relative;
    top: auto;
    right: auto;
    background: transparent;
    border: none;
    border-radius: 0;
    width: 36px;
    height: 36px;
    font-size: 28px;
    line-height: 1;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: 0 28px 28px;
}

.fmw-modal.fmw-skin-studio .fmw-search label {
    display: block;
    margin: 8px 0 6px;
    font-size: 14px;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-search input {
    width: 100%;
    border: 1px solid #cfcfcf;
    border-radius: 2px;
    background: #fff;
    padding: 10px 12px;
    font-size: 14px;
}

.fmw-modal.fmw-skin-studio .fmw-search input::placeholder {
    color: #999;
}

.fmw-modal.fmw-skin-studio .fmw-categories-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 14px 0 8px;
}

.fmw-modal.fmw-skin-studio .fmw-category-pill {
    background: transparent;
    border: 1px solid var(--fmw-studio-line);
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 12px;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-category-pill.active {
    background: var(--fmw-studio-fill);
    border-color: var(--fmw-studio-fill);
    color: #fafaf9;
}

.fmw-modal.fmw-skin-studio .fmw-sort-options,
.fmw-modal.fmw-skin-studio .fmw-results-bar {
    display: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabrics-grid {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-option {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 168px;
    gap: 16px;
    align-items: start;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card {
    display: block;
    position: relative;
    padding: 16px;
    border: 1px solid #d0d0d0;
    border-radius: 4px;
    background: #fff;
    box-shadow: none;
    cursor: pointer;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-selected-badge {
    display: none;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
    padding: 4px 8px;
    border-radius: 2px;
    background: var(--fmw-studio-fill);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.02em;
    line-height: 1.2;
    pointer-events: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-selected .fmw-fabric-selected-badge {
    display: inline-block;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-selected .fmw-fabric-details > .fmw-select-fabric {
    display: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-selected.is-details-open .fmw-fabric-details {
    padding-right: 88px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-selected .fmw-select-fabric--primary {
    background: #fff;
    color: var(--fmw-studio-ink);
    border: 1px solid var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-selected,
.fmw-modal.fmw-skin-studio .fmw-fabric-card:hover {
    border-color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-thumb {
    width: 168px;
    height: 134px;
    overflow: hidden;
    background: var(--fmw-studio-paper);
    border-radius: 2px;
}

/* A: hide list thumb while Fabric details gallery is open */
.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-fabric-thumb {
    display: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-fabric-option {
    display: block;
    width: 100%;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-fabric-details {
    position: relative;
    width: 100%;
    max-width: none;
    padding-right: 96px;
    box-sizing: border-box;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-fabric-details > .fmw-select-fabric {
    position: absolute;
    top: 0;
    right: 0;
    margin-top: 0;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-fabric-more {
    display: block;
    width: 100%;
    max-width: none;
    box-sizing: border-box;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-simple-gallery,
.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-simple-gallery-main,
.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-bulk-rates {
    width: 100%;
    max-width: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-simple-gallery-main {
    height: 280px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-card.is-details-open .fmw-simple-gallery-main img {
    height: 280px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-details h4 {
    margin: 0 0 4px;
    font-size: 16px;
    font-weight: 700;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-size-price {
    margin: 0 0 6px;
    font-size: 13px;
    color: var(--fmw-studio-muted);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-details p,
.fmw-modal.fmw-skin-studio .fmw-fabric-meta {
    font-size: 13px;
    color: var(--fmw-studio-ink);
    margin: 0 0 8px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-meta {
    color: var(--fmw-studio-muted);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 0 0 10px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-tag {
    display: inline-block;
    padding: 2px 8px;
    border: 1px solid #ddd;
    border-radius: 999px;
    font-size: 11px;
    color: var(--fmw-studio-muted);
    background: #fff;
}

.fmw-modal.fmw-skin-studio .fmw-show-more,
.fmw-modal.fmw-skin-studio .fmw-show-less {
    font-size: 13px;
    color: var(--fmw-studio-ink);
    text-decoration: underline;
    background: none;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-details > .fmw-select-fabric {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-top: 10px;
    padding: 8px 14px;
    border: 1px solid var(--fmw-studio-ink);
    border-radius: 2px;
    background: #fff;
    color: var(--fmw-studio-ink);
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-details > .fmw-select-fabric:hover {
    background: var(--fmw-studio-ink);
    color: #fff;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-more-actions {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-top: 14px;
    flex-wrap: wrap;
}

.fmw-modal.fmw-skin-studio .fmw-select-fabric--primary {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 10px 18px;
    border: none;
    border-radius: 2px;
    background: var(--fmw-studio-fill);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer;
    position: static;
    width: auto;
    height: auto;
    overflow: visible;
    clip: auto;
}

.fmw-modal.fmw-skin-studio .fmw-select-fabric--primary:hover {
    background: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-more {
    display: none;
    width: 100%;
    margin: 16px 0 0;
    padding-top: 16px;
    border-top: 1px solid var(--fmw-studio-line);
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery {
    width: 100%;
    margin: 0 0 12px;
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-main {
    width: 100%;
    height: 240px;
    overflow: hidden;
    border-radius: 4px;
    background: var(--fmw-studio-paper);
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-main img {
    width: 100%;
    height: 240px;
    object-fit: cover;
    display: block;
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-thumbs {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-thumb {
    width: 48px;
    height: 48px;
    padding: 0;
    border: 1px solid var(--fmw-studio-line);
    border-radius: 2px;
    overflow: hidden;
    background: #fff;
    cursor: pointer;
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-thumb.is-active {
    border-color: var(--fmw-studio-fill);
    box-shadow: 0 0 0 1px var(--fmw-studio-fill);
}

.fmw-modal.fmw-skin-studio .fmw-simple-gallery-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.fmw-modal.fmw-skin-studio .fmw-bulk-rates {
    margin: 14px 0 8px;
}

.fmw-modal.fmw-skin-studio .fmw-bulk-rates-heading {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-bulk-rates-sub {
    margin: 2px 0 12px;
    font-size: 12px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--fmw-studio-muted);
}

.fmw-modal.fmw-skin-studio .fmw-bulk-rates-group + .fmw-bulk-rates-group {
    margin-top: 14px;
}

.fmw-modal.fmw-skin-studio .fmw-bulk-rates-width {
    margin: 0 0 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .fmw-bulk-tier-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.fmw-modal.fmw-skin-studio .fmw-bulk-tier {
    flex: 1 1 120px;
    min-width: 110px;
    padding: 12px 10px;
    border: 1px solid var(--fmw-studio-line);
    border-radius: 4px;
    background: #fff;
    text-align: center;
}

.fmw-modal.fmw-skin-studio .fmw-bulk-tier-qty {
    display: block;
    margin: 0 0 6px;
    font-size: 12px;
    color: var(--fmw-studio-muted);
}

.fmw-modal.fmw-skin-studio .fmw-bulk-tier-price {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--fmw-studio-ink);
    line-height: 1.2;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap {
    position: relative;
    width: 100%;
    max-width: 100%;
    height: auto;
    overflow: visible;
    border-radius: 4px;
    margin: 0 0 12px;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap .fabric-swiper,
.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap .swiper {
    width: 100%;
    height: 240px;
    min-height: 240px;
    max-height: 240px;
    overflow: hidden;
    border-radius: 4px;
    background: var(--fmw-studio-paper);
}

.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap .swiper-slide img {
    width: 100%;
    height: 240px;
    max-height: 240px;
    object-fit: cover;
    display: block;
}

.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap.is-single .swiper-pagination,
.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap.is-single .swiper-button-prev,
.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap.is-single .swiper-button-next,
.fmw-modal.fmw-skin-studio .fmw-fabric-swiper-wrap.is-single .fabric-swiper-thumbs {
    display: none !important;
}

.fmw-modal.fmw-skin-studio .swiper-button-prev,
.fmw-modal.fmw-skin-studio .swiper-button-next {
    display: flex;
    width: 28px;
    height: 28px;
    margin-top: 0;
    background: rgba(255, 255, 255, 0.92);
    border-radius: 50%;
    color: var(--fmw-studio-ink);
}

.fmw-modal.fmw-skin-studio .swiper-button-prev::after,
.fmw-modal.fmw-skin-studio .swiper-button-next::after {
    font-size: 12px;
    font-weight: 700;
}

.fmw-modal.fmw-skin-studio .swiper-pagination {
    display: block;
}

.fmw-modal.fmw-skin-studio .fabric-swiper-thumbs {
    display: flex !important;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 8px;
    justify-content: flex-start;
}

.fmw-modal.fmw-skin-studio .fabric-swiper-thumb {
    width: 48px;
    height: 48px;
    border: 1px solid var(--fmw-studio-line);
    opacity: 1;
}

.fmw-modal.fmw-skin-studio .fabric-swiper-thumb.active {
    border-color: var(--fmw-studio-fill);
    box-shadow: 0 0 0 1px var(--fmw-studio-fill);
}

@media (max-width: 720px) {
    .fmw-modal.fmw-skin-studio {
        align-items: flex-end;
        padding: 0 !important;
    }

    .fmw-modal.fmw-skin-studio .fmw-modal-content {
        width: 100% !important;
        max-width: 100vw !important;
        height: 92vh !important;
        max-height: 92vh !important;
        border-radius: 12px 12px 0 0 !important;
        transform: translateY(100%);
    }

    .fmw-modal.fmw-skin-studio.show .fmw-modal-content {
        transform: translateY(0);
    }

    .fmw-modal.fmw-skin-studio .fmw-fabric-option {
        grid-template-columns: 1fr;
    }

    .fmw-modal.fmw-skin-studio .fmw-fabric-thumb {
        width: 100%;
        height: 180px;
        order: -1;
    }
}