/**
 * ==========================================================================
 * TEMPLATE FORMS STYLES
 * ==========================================================================
 * 
 * Shared styles for template pages (create, edit, select, etc.)
 * Core form styles are in components/forms.css
 * Moved from css/template-forms.css during 2026-02-05 reorganization.
 * 
 * @package Verimus
 * @since 2.0.0
 * ==========================================================================
 */

/* Page Titles */
.create-title,
.edit-title,
.select-title,
.page-title {
    font-size: var(--font-size-2xl);
    font-weight: var(--font-weight-semibold);
    color: var(--text-primary);
    margin-bottom: var(--spacing-8);
}

/* Form Containers */
.collection-form,
.task-form,
.edit-form {
    max-width: 650px;
}

#pd-selection-panel,
#template-fields-container,
#contract-fields-container {
    max-width: 650px;
}

/* Contract creation: all sections same width */
#contract-fields-container+.send-document-bottom,
#contract-fields-container #template-fields-container,
.content-body #contract-fields-container #create-document-form,
.contract-template-selection {
    max-width: 650px;
}

#contract-fields-container:has(.hrc-custom-template-issue-fields),
#contract-fields-container:has(.hrc-custom-template-issue-fields) + .send-document-bottom,
.content-body #contract-fields-container:has(.hrc-custom-template-issue-fields) #create-document-form {
    max-width: 100%;
}

#template-fields-container #create-document-form,
#contract-fields-container form {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0 var(--spacing-6, 24px);
}

@media (min-width: 768px) {
    #template-fields-container #create-document-form {
        grid-template-columns: repeat(2, 1fr);
    }

    #template-fields-container #create-document-form .form-group[data-field-type="textarea"],
    #template-fields-container #create-document-form .form-group[data-field-type="html"],
    #template-fields-container #create-document-form .form-actions {
        grid-column: 1 / -1;
    }
}

/* Contract creation: single column layout */
#contract-fields-container form,
#contract-fields-container #create-document-form {
    grid-template-columns: 1fr;
}

#template-fields-container .form-group,
#contract-fields-container .form-group {
    max-width: 100%;
}

.hrc-custom-template-issue-fields {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 32px;
    align-items: start;
    grid-column: 1 / -1;
}

.content-body > .row > .col-lg-8.col-12:has(.hrc-custom-template-issue-fields) {
    flex: 0 0 100%;
    width: 100%;
    max-width: 100%;
}

.hrc-custom-template-issue-fields__inputs {
    min-width: 0;
}

.hrc-custom-template-issue-fields__preview {
    position: sticky;
    top: 24px;
    min-width: 0;
    border: 1px solid rgba(12, 35, 64, 0.14);
    border-radius: 8px;
    background: #fff;
    overflow: hidden;
}

.hrc-custom-template-issue-fields__preview-head {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    align-items: center;
    border-bottom: 1px solid rgba(12, 35, 64, 0.1);
    padding: 12px 16px;
    background: #f7f9fb;
}

.hrc-custom-template-issue-fields__preview-head h3 {
    margin: 0;
    color: #0c2340;
    font-size: 16px;
}

.hrc-custom-template-issue-fields__preview-head span {
    color: #197a7a;
    font-size: 12px;
    font-weight: 700;
}

.hrc-custom-template-issue-fields__warnings {
    border-bottom: 1px solid rgba(220, 53, 69, 0.22);
    padding: 10px 16px;
    color: #842029;
    background: #f8d7da;
    font-size: 13px;
}

.hrc-custom-template-issue-fields__warnings p {
    margin: 0 0 4px;
}

.hrc-custom-template-issue-fields__warnings p:last-child {
    margin-bottom: 0;
}

.hrc-custom-template-issue-fields__document {
    max-height: 720px;
    overflow: auto;
    padding: 28px 36px;
    color: #1f2937;
    background: #fff;
    font-size: 13px;
    line-height: 1.5;
}

.hrc-custom-template-issue-fields__document .hrc-ctb-clause {
    display: flex;
    gap: 9px;
    align-items: baseline;
}

.hrc-custom-template-issue-fields__document .hrc-ctb-clause-number {
    min-width: 34px;
    color: #0c2340;
    font-weight: 700;
    flex: none;
}

.hrc-custom-template-issue-fields__document .hrc-ctb-reference.is-missing {
    color: #842029;
    font-weight: 700;
}

.hrc-custom-template-overrides .text-muted {
    margin: 0 0 12px;
    font-size: 13px;
}

@media (max-width: 991px) {
    .hrc-custom-template-issue-fields {
        grid-template-columns: 1fr;
    }

    .hrc-custom-template-issue-fields__preview {
        position: static;
    }
}

/* Template page specific form controls */
.template-page .form-control {
    border: var(--input-border-width) solid var(--input-border-color);
    border-radius: var(--input-border-radius);
    padding: var(--input-padding-y) var(--input-padding-x);
    font-size: var(--input-font-size);
    background-color: var(--input-bg);
    height: var(--input-height);
}

.template-page .form-control::placeholder {
    color: var(--input-placeholder-color);
}

/* Primary Save Button */
.save-btn {
    background-color: var(--color-primary);
    color: var(--white);
    padding: var(--spacing-3) var(--spacing-6);
    border-radius: var(--radius-md);
    border: none;
    font-weight: var(--font-weight-medium);
    transition: background-color var(--transition-base);
}

.save-btn:hover:not(:disabled) {
    background-color: var(--color-primary-dark);
    color: var(--white);
}

.save-btn:disabled {
    opacity: 0.7;
    cursor: not-allowed;
}

/* Cancel/Secondary Button */
.cancel-btn {
    background-color: transparent;
    color: var(--text-secondary);
    padding: var(--spacing-2) var(--spacing-6);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
}

.cancel-btn:hover {
    background-color: var(--gray-100);
}

/* Note: .form-actions is defined in components/forms.css */

/* Task Section */
.tasks-section {
    background-color: var(--gray-50);
    border-radius: var(--radius-md);
    padding: var(--spacing-6);
}

.tasks-section h3 {
    font-size: var(--font-size-lg);
    font-weight: var(--font-weight-semibold);
    margin: 0;
}

#tasks-table {
    background-color: var(--white);
    border-radius: var(--radius-md);
}

/* Documents Selection */
.documents-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--spacing-6);
}

.documents-filters {
    display: flex;
    gap: var(--spacing-4);
}

.search-container {
    width: 300px;
}

/* Category Tags */
.category-tag {
    background-color: var(--color-info-light);
    color: var(--color-info);
    padding: var(--spacing-1) var(--spacing-3);
    border-radius: var(--radius-full);
    font-size: var(--font-size-sm);
}

/* DataTables Overrides */
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
    background-image: none !important;
}

.search-box {
    min-width: 250px;
}

/* Candidate Portal Specifics */
.candidate-portal {
    background: var(--gray-100);
    min-height: calc(100vh - 100px);
    padding: var(--spacing-10) 0;
}

.candidate-portal .contract-item:hover {
    border-color: var(--color-primary);
    box-shadow: 0 4px 12px rgba(255, 128, 48, 0.15);
}

.candidate-portal .btn:hover {
    background: var(--color-primary-dark) !important;
}

.candidate-portal .sidebar-content {
    display: none !important;
}

/* Dark mode support */
.dark-mode .candidate-portal {
    background: var(--dark-bg-primary);
}

.dark-mode .candidate-portal .contract-item {
    background: var(--dark-bg-secondary);
    border-color: var(--dark-border);
}

.dark-mode .create-title,
.dark-mode .edit-title,
.dark-mode .select-title,
.dark-mode .page-title {
    color: var(--dark-text-primary);
}

.dark-mode .tasks-section {
    background-color: var(--dark-bg-secondary);
}

.dark-mode #tasks-table {
    background-color: var(--dark-bg-tertiary);
}