/*
    THEME: STREET POSTERS
    Description: Analog, warm, imperfect, musical. Concrete/paper background with poster-style links.
*/

@import url('https://fonts.googleapis.com/css2?family=Courier+Prime:ital,wght@0,400;0,700;1,400&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

/* 1. Base Structure Overrides - Using the new theme namespace */
html.theme-street_posters {
    /* Warm dirty beige/grey wall background */
    background-color: #d8d3c5;
    background-image:
        /* Subtle grunge/noise texture */
        url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)' opacity='0.08'/%3E%3C/svg%3E"),
        /* Subtle horizontal wall lines/imperfections */
        repeating-linear-gradient(to bottom, transparent, transparent 40px, rgba(0,0,0,0.02) 41px, rgba(0,0,0,0.01) 42px);
    background-attachment: fixed;
}

html.theme-street_posters body {
    color: #2c2a25; /* Soft, warm dark grey, avoiding pure black */
    font-family: 'Courier Prime', 'Courier New', monospace !important; /* Analog type */
}

/* Avatar sharp borders */
html.theme-street_posters .circle-avatar-overlay,
html.theme-street_posters .circle-avatar-overlay.with-border {
    border-radius: 2px !important;
}
html.theme-street_posters .circle-avatar-overlay.with-border {
    border-width: 4px !important;
    border-color: #d4cdc1 !important;
    box-shadow: 3px 4px 8px rgba(0,0,0,0.15) !important;
}
html.theme-street_posters .circle-avatar-overlay img,
html.theme-street_posters .circle-avatar-overlay video {
    border-radius: 0 !important;
}

/* Add some texture to the profile card to make it look like a glued poster */
html.theme-street_posters .profile-card {
    background-color: #f4f1e1 !important; /* Off-white / old paper color */
    background-image:
        url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter2'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter2)' opacity='0.04'/%3E%3C/svg%3E") !important;
    box-shadow:
        0 4px 15px rgba(0, 0, 0, 0.1), /* Base shadow */
        0 1px 3px rgba(0, 0, 0, 0.05), /* Sharp inner shadow */
        inset 0 0 20px rgba(0,0,0,0.03) !important; /* Subtle vignette on the paper */
    border-radius: 12px !important;
}

html.theme-street_posters .profile-header-image-container {
    background-color: transparent !important;
    border-radius: 12px 12px 0 0 !important;
}

/* Titles and Artist Name - Rougher, analog feel */
html.theme-street_posters .artist-name {
    font-weight: 900 !important;
    text-transform: uppercase;
    letter-spacing: -1px;
    color: #ba382f; /* Faded brick red / rust color */
    text-shadow: 2px 2px 0px rgba(0,0,0,0.1);
    margin-bottom: 5px;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
    font-size: 2.8rem !important; /* Aumentado */
    line-height: 1.1;
}

html.theme-street_posters .band-bio {
    font-family: "Playfair Display", "Georgia", serif !important;
    font-size: 1.05rem !important;
    line-height: 1.6 !important;
    color: #4a4539 !important;
}

/* Standard Poster Links - MÁS MARCADOS */
html.theme-street_posters .simple-link-item,
html.theme-street_posters .album-link-capsule,
html.theme-street_posters .spotify-track-link,
html.theme-street_posters .artist-profile-card {
    background-color: #fdfbf7 !important; /* Very light paper */
    border: 3px solid #d4cdc1 !important; /* MÁS GRUESO */
    border-radius: 2px !important; /* Very slight rounding, almost square like a poster */
    box-shadow:
        3px 4px 8px rgba(0,0,0,0.15),
        1px 1px 1px rgba(0,0,0,0.1) !important;
    margin-bottom: 15px !important;
    transition: all 0.2s ease-in-out;
    position: relative;
    /* Create a slight rotation effect on some items to look hastily pasted, handled via nth-child */
}

/* Alternate slight tilts for that "hastily glued on a wall" look */
html.theme-street_posters .content-links:not(.links-carousel) > *:nth-child(odd) {
    transform: rotate(-1.5deg) !important;
}
html.theme-street_posters .content-links:not(.links-carousel) > *:nth-child(even) {
    transform: rotate(1.5deg) !important;
}

html.theme-street_posters .simple-link-item:hover,
html.theme-street_posters .album-link-capsule:hover,
html.theme-street_posters .spotify-track-link:hover,
html.theme-street_posters .artist-profile-card:hover {
    transform: translateY(-2px) rotate(0deg) scale(1.02) !important;
    box-shadow:
        5px 7px 15px rgba(0,0,0,0.2),
        1px 1px 3px rgba(0,0,0,0.1) !important;
    background-color: #ffffff !important;
    border-color: #ba382f !important;
    z-index: 2;
}

/* Link Titles & Headings */
html.theme-street_posters .section-title,
html.theme-street_posters .simple-link-title,
html.theme-street_posters .album-title,
html.theme-street_posters .track-title,
html.theme-street_posters .artist-card-name {
    font-weight: bold !important;
    color: #2c2a25 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.5px !important;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
    font-size: 1rem !important;
}

html.theme-street_posters .simple-link-left i,
html.theme-street_posters .album-capsule-icon i,
html.theme-street_posters .spotify-track-header i,
html.theme-street_posters .artist-platform-badge i {
    color: #ba382f !important;
    font-size: 1.2rem !important;
}

/* Embeds (Spotify, YouTube, etc.) - Make them look like pasted cards too */
html.theme-street_posters .youtube-embed-container {
    background-color: #fdfbf7 !important;
    /* padding removed to preserve aspect ratio */
    border: 3px solid #d4cdc1 !important;
    border-radius: 2px !important;
    box-shadow:
        3px 4px 8px rgba(0,0,0,0.15) !important;
    margin-bottom: 30px !important;
    transform: none !important; /* Quitar rotación para que el iframe de video no de problemas de visibilidad */
    /* Ensure no padding overrides break the 56.25% padding-bottom aspect ratio */
}

/* Remove border radius from internal iframe if possible to match the sharp poster look */
html.theme-street_posters .youtube-embed-container iframe,
html.theme-street_posters .youtube-embed-container .youtube-preview-inner {
    border-radius: 0 !important;
    top: 10px !important;
    left: 10px !important;
    right: 10px !important;
    bottom: 10px !important;
    width: calc(100% - 20px) !important;
    height: calc(100% - 20px) !important;
}

/* Event List & Gallery overrides */
html.theme-street_posters .gallery-photo-item {
    border-radius: 0 !important;
}
html.theme-street_posters .event-card {
    background-color: #fdfbf7 !important;
    border: 3px solid #d4cdc1 !important;
    border-radius: 2px !important;
    box-shadow: 3px 4px 8px rgba(0,0,0,0.15) !important;
    margin-bottom: 15px !important;
}
html.theme-street_posters .events-list > .event-card:nth-child(odd) {
    transform: rotate(-1.5deg) !important;
}
html.theme-street_posters .events-list > .event-card:nth-child(even) {
    transform: rotate(1.5deg) !important;
}


/* Buttons (Share, Subscribe, CTA) */
html.theme-street_posters .share-icon,
html.theme-street_posters button[data-micromodal-trigger="modal-share"] {
    background-color: #ebe5d5 !important;
    color: #2c2a25 !important;
    border: 2px solid #c2baa6 !important;
    border-radius: 4px !important;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.1) !important;
    transition: all 0.1s ease;
}

html.theme-street_posters .share-icon:hover,
html.theme-street_posters button[data-micromodal-trigger="modal-share"]:hover {
    background-color: #dfd8c4 !important;
    transform: translate(1px, 1px) !important;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.1) !important;
}

html.theme-street_posters .cta-button {
    background-color: #ba382f !important;
    color: #fff !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: 2px !important;
    box-shadow: 4px 4px 0 rgba(0,0,0,0.15) !important;
    transition: all 0.1s ease;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
}

html.theme-street_posters .cta-button:hover {
    background-color: #9d2f27 !important;
    transform: translate(2px, 2px) !important;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.15) !important;
}

/* Footer Links */
html.theme-street_posters .footer-legal a {
    color: #6c6656 !important;
    text-decoration: underline !important;
    text-decoration-style: dotted !important;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
}

html.theme-street_posters .footer-legal a:hover {
    color: #ba382f !important;
}

/* Styles tags (genres) */
html.theme-street_posters .band-style-tag {
    background-color: #ba382f !important;
    color: #fff !important;
    border-radius: 2px !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    font-size: 0.8rem !important;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.2) !important;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
}

/* Event Tickets and Store Buttons */
html.theme-street_posters .ticket-button,
html.theme-street_posters .btn-buy-large {
    background-color: #ba382f !important;
    color: #fdfbf7 !important;
    border-radius: 2px !important;
    border: 2px solid #d4cdc1 !important;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.15) !important;
    transition: all 0.1s ease;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
    text-transform: uppercase !important;
    font-weight: bold !important;
}

html.theme-street_posters .ticket-button:hover,
html.theme-street_posters .btn-buy-large:hover {
    background-color: #9d2f27 !important;
    transform: translate(1px, 1px) !important;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.15) !important;
    color: #fff !important;
}

html.theme-street_posters .btn-calendar-simple {
    background-color: #ebe5d5 !important;
    color: #2c2a25 !important;
    border: 2px solid #c2baa6 !important;
    border-radius: 4px !important;
    box-shadow: 2px 2px 0 rgba(0,0,0,0.1) !important;
    transition: all 0.1s ease;
}

html.theme-street_posters .btn-calendar-simple:hover {
    background-color: #dfd8c4 !important;
    transform: translate(1px, 1px) !important;
    box-shadow: 1px 1px 0 rgba(0,0,0,0.1) !important;
}

html.theme-street_posters .store-item-button {
    color: #ba382f !important;
    font-family: 'Courier Prime', 'Courier New', monospace !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
}
