/*
 * Robank Data Sheets Plugin - Frontend Styles
 *
 * @package Robank_Data_Sheets
 * @subpackage Assets/CSS
 */

/* General container for the PDF viewer */
body .robank-pdf-viewer-container {
    font-family: 'Inter', sans-serif; /* Using Inter font as per instructions */
    background-color: #f8f8f8;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 20px;
    margin: 20px auto; /* Centering will now work without max-width */
    /* max-width: 900px; -- REMOVED/BLOCKED OUT as per your finding */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative; /* For loading message positioning */
    overflow: hidden; /* To contain canvas */
}

/* PDF Controls */
body .robank-pdf-controls {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 15px;
    margin-bottom: 20px;
    background-color: #ffffff;
    padding: 10px 20px;
    border-radius: 50px; /* Pill shape for controls */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
    flex-wrap: wrap; /* Allow wrapping on small screens */
}

body .robank-pdf-button {
    background-color: #007bff; /* Primary button color */
    color: #ffffff;
    padding: 8px 18px;
    border: none;
    border-radius: 25px; /* Rounded buttons */
    font-size: 15px;
    cursor: pointer;
    transition: background-color 0.3s ease, transform 0.2s ease;
    text-transform: uppercase;
    font-weight: bold;
    letter-spacing: 0.5px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

body .robank-pdf-button:hover {
    background-color: #0056b3; /* Darker on hover */
    transform: translateY(-1px); /* Slight lift effect */
}

body .robank-pdf-button:active {
    transform: translateY(0);
}

body #robank-pdf-page-num,
body #robank-pdf-page-count {
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

/* PDF Canvas */
body #robank-pdf-canvas {
    border: 1px solid #ddd;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    max-width: 100%; /* Ensure canvas is responsive */
    height: auto;
    display: block; /* Remove extra space below canvas */
}

/* Loading and Error Messages */
body .robank-pdf-loading-message,
body .robank-pdf-error-message {
    text-align: center;
    color: #666;
    font-size: 1.1em;
    padding: 20px;
    margin-top: 20px;
}

body .robank-pdf-error-message {
    color: #dc3545; /* Red for errors */
    font-weight: bold;
}

/* Password Protection Form Styling */

/* Style for the password form container itself */
body .robank-pdf-viewer-container .robank-ds-password-form-container {
    background-color: #f8f8f8 !important; /* Added !important */
    border: 1px solid #e0e0e0 !important; /* Added !important */
    border-radius: 8px !important; /* Added !important */
    padding: 20px !important; /* Added !important */
    margin: 20px auto !important; /* Added !important */
    max-width: 500px !important; /* Added !important */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08) !important; /* Added !important */
    text-align: center !important; /* Added !important */
}

/* Message above the password field */
body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-required {
    font-size: 1.1em !important; /* Added !important */
    color: #333 !important; /* Added !important */
    margin-bottom: 20px !important; /* Added !important */
}

/* Styles for the password form itself */
body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form {
    display: flex !important; /* Added !important */
    flex-direction: column !important; /* Added !important */
    align-items: center !important; /* Added !important */
    gap: 15px !important; /* Added !important */
}

/* Label for the password input */
body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form label {
    font-weight: bold !important; /* Added !important */
    color: #555 !important; /* Added !important */
    font-size: 1em !important; /* Added !important */
}

/* Password input field */
body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form input[type="password"] {
    padding: 10px 15px !important; /* Added !important */
    border: 1px solid #ccc !important; /* Added !important */
    border-radius: 5px !important; /* Added !important */
    font-size: 16px !important; /* Added !important */
    width: 100% !important; /* Added !important */
    max-width: 300px !important; /* Added !important */
    box-sizing: border-box !important; /* Added !important */
}

/* Submit button */
body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form input[type="submit"] {
    background-color: #007bff !important; /* Primary button color */
    color: #ffffff !important;
    padding: 10px 25px !important;
    border: none !important; /* Added !important */
    border-radius: 5px !important; /* Added !important */
    font-size: 16px !important; /* Added !important */
    cursor: pointer !important; /* Added !important */
    transition: background-color 0.3s ease !important; /* Added !important */
    text-transform: uppercase !important; /* Added !important */
    font-weight: bold !important; /* Added !important */
    letter-spacing: 0.5px !important; /* Added !important */
}

body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form input[type="submit"]:hover {
    background-color: #0056b3 !important; /* Darker on hover */
}


/* Security related styles (e.g., cursor for no-copy zones) */
body .robank-ds-no-copy {
    -webkit-touch-callout: none !important; /* iOS Safari */
    -webkit-user-select: none !important;   /* Safari */
    -khtml-user-select: none !important;    /* Konqueror HTML */
    -moz-user-select: none !important;      /* Old versions of Firefox */
    -ms-user-select: none !important;       /* Internet Explorer/Edge */
    user-select: none !important;           /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    cursor: default !important;             /* Indicate non-interactive */
}

/* Prevent text selection and right-click on the PDF content */
body .robank-pdf-canvas {
    -webkit-touch-callout: none !important; /* iOS Safari */
    -webkit-user-select: none !important;   /* Safari */
    -khtml-user-select: none !important;    /* Konqueror HTML */
    -moz-user-select: none !important;      /* Old versions of Firefox */
    -ms-user-select: none !important;       /* Internet Explorer/Edge */
    user-select: none !important;           /* Non-prefixed version, currently supported by Chrome, Edge, Opera and Firefox */
    pointer-events: none !important;        /* Disable all pointer events on the canvas */
}

/* Responsive adjustments */
@media (max-width: 768px) {
    body .robank-pdf-viewer-container {
        padding: 15px !important;
        margin: 15px auto !important;
    }

    body .robank-pdf-controls {
        flex-direction: column !important; /* Stack buttons vertically */
        gap: 8px !important; /* Smaller gap */
        padding: 8px !important; /* Smaller padding */
    }

    body .robank-pdf-button {
        width: 100% !important; /* Full width buttons */
        text-align: center !important;
        padding: 8px 15px !important; /* Smaller padding for buttons */
        font-size: 14px !important; /* Smaller font size for buttons */
    }

    body #robank-pdf-page-num,
    body #robank-pdf-page-count {
        font-size: 16px !important; /* Smaller font size for page numbers */
    }

    body .robank-pdf-viewer-container .robank-ds-password-form-container {
        padding: 15px !important;
        margin: 15px auto !important;
    }

    body .robank-pdf-viewer-container .robank-ds-password-form-container .robank-ds-password-form input[type="password"] {
        max-width: 250px !important;
    }
}