/* ===================================
   HIPERCONFORT - Global Styles
   =================================== */

/* ===================================
   MEDIA PROTECTION STYLES
   Prevents downloading of images, 
   logos, and videos
   =================================== */

/* Prevent image drag and selection */
img,
video,
.protected-media,
picture,
source,
svg,
canvas {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    pointer-events: auto;
}

/* Prevent touch callout on mobile (iOS) */
img,
video,
.protected-media {
    -webkit-touch-callout: none;
}

/* Transparent overlay to prevent right-click saving */
.media-protected-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
}

.media-protected-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 10;
    background: transparent;
    pointer-events: all;
}

/* Allow interaction with video controls but block download */
.media-protected-wrapper video::-webkit-media-controls-enclosure {
    pointer-events: auto;
}

/* Hide download button in video controls (Chrome/Edge) */
video::-webkit-media-controls-download-button,
video::-internal-media-controls-download-button {
    display: none !important;
}

/* Hide overflow menu with download option in video controls */
video::-webkit-media-controls-overflow-button {
    display: none !important;
}

/* Firefox: Hide video context menu download option */
video::-moz-media-controls-download-button {
    display: none !important;
}

/* Additional protection for background images */
[style*="background-image"],
.bg-cover,
.bg-contain,
.bg-center {
    -webkit-user-drag: none;
}

/* Prevent text selection in media containers */
.media-container {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* ===================================
   PRINT PROTECTION
   Hides images/videos when printing
   =================================== */
@media print {

    img:not(.printable),
    video,
    .protected-media,
    .no-print {
        display: none !important;
    }
}

/* ===================================
   ANTI-SCREENSHOT WATERMARK
   Shows watermark when Dev Tools open
   =================================== */
.watermark-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 9999;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.watermark-overlay.active {
    opacity: 0.15;
    background: repeating-linear-gradient(45deg,
            transparent,
            transparent 100px,
            rgba(0, 0, 0, 0.03) 100px,
            rgba(0, 0, 0, 0.03) 200px);
}

.watermark-overlay.active::before {
    content: '© HIPERCONFORT - Contenido Protegido';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-45deg);
    font-size: 48px;
    font-weight: bold;
    color: rgba(0, 0, 0, 0.1);
    white-space: nowrap;
}

/* ===================================
   CUSTOM SCROLLBAR (optional)
   =================================== */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #06b6d4, #0891b2);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #0891b2, #0e7490);
}

/* ===================================
   SMOOTH SCROLLING
   =================================== */
html {
    scroll-behavior: smooth;
}

/* ===================================
   FOCUS STYLES FOR ACCESSIBILITY
   =================================== */
*:focus-visible {
    outline: 2px solid #06b6d4;
    outline-offset: 2px;
}

/* ===================================
   SELECTION COLORS
   =================================== */
::selection {
    background-color: rgba(6, 182, 212, 0.3);
    color: inherit;
}

::-moz-selection {
    background-color: rgba(6, 182, 212, 0.3);
    color: inherit;
}