.pascom-int{
            width:200px;
        }
        .form-container {
            background: white;
            padding: 2rem;
            border-radius: 12px;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.1);
        }
        .input-group-text {
            background-color: #198754;
            color: white;
            border-radius: 8px 0px 0px 8px;
        }
        .form-control, .form-select {
            border-radius: 8px;
        }
        label {
            font-weight: 600;
            color: #343a40;
        }
        .btn-submit {
            background-color: #198754;
            color: white;
            font-weight: bold;
            padding: 10px;
            border-radius: 8px;
            transition: all 0.3s ease-in-out;
        }
        .btn-submit:hover {
            background-color: #157347;
        }
       .paroquia-grid {
            display: flex;
            flex-wrap: wrap;
            gap: 1.5rem;
            justify-content: center;
        }
        .paroquia-card {
            border: 2px solid #e0e0e0;
            border-radius: 12px;
            padding: 1rem 1.5rem;
            background: #fff;
            display: flex;
            flex-direction: column;
            align-items: center;
            cursor: pointer;
            transition: border-color 0.2s, box-shadow 0.2s;
            min-width: 180px;
            max-width: 220px;
            box-shadow: 0 2px 8px rgba(0,0,0,0.03);
            position: relative;
        }
        .paroquia-card.selected, .paroquia-card:hover {
            border-color: #007bff;
            box-shadow: 0 4px 16px rgba(0,123,255,0.08);
        }
        .paroquia-card img {
            width: 56px;
            height: 56px;
            object-fit: cover;
            border-radius: 50%;
            margin-bottom: 0.75rem;
            border: 2px solid #f0f0f0;
            background: #f8f9fa;
        }
        .paroquia-card .paroquia-name {
            font-weight: 600;
            font-size: 1.1rem;
            text-align: center;
        }
        .paroquia-radio {
            display: none;
        }
        .paroquia-card .checkmark {
            display: none;
            position: absolute;
            top: 10px;
            right: 12px;
            color: #007bff;
            font-size: 1.4rem;
        }
        .paroquia-card.selected .checkmark {
            display: block;
        }
        #calendario-campo {
            display: none;
            animation: fadeIn 0.5s;
        }
        @keyframes fadeIn {
            from { opacity: 0; transform: translateY(24px);}
            to { opacity: 1; transform: translateY(0);}
        }
        .paroquia-card.selected { border: 2px solid #007bff; }
        /* Container */
#calendar-area table {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
    background: #fff;
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
}

#calendar-area th {
    text-align: center;
    padding: 8px 0;
    background: #f8f9fa;
    font-weight: 600;
    font-size: 0.9rem;
    color: #495057;
}

#calendar-area td {
    height: 70px;
    vertical-align: top;
    text-align: right;
    padding: 6px;
    border: 1px solid #e9ecef;
    font-size: 0.9rem;
    cursor: pointer;
    transition: background 0.2s;
}

/* Dias normais */
#calendar-area td:hover {
    background: #f1f3f4;
}

/* Disponível */
#calendar-area td.available {
    background: #d4edda;
    color: #155724;
    font-weight: bold;
}

/* Indisponível */
#calendar-area td.unavailable {
    background: #f8d7da;
    color: #721c24;
    font-weight: bold;
}

/* Hoje */
#calendar-area td.today {
    border: 2px solid #007bff;
    font-weight: 700;
    background: #e9f2ff;
}
 .legend-box {
    display: inline-block;
    width: 16px;
    height: 16px;
    border-radius: 4px; /* deixa o quadrado com cantos arredondados */
  }
    /* Aplica apenas em celulares até 768px de largura e em modo retrato */
    @media screen and (max-width: 768px) and (orientation: portrait) {
    #calendar-area {
        height: 700px !important;
    }
    }

    /* Em outros casos, altura automática */
    #calendar-area {
    height: auto;
    }